如何使用CSS和Javascript来缩小HTML?

我有一个.html文件与CSS和 Javascript里面的文件(没有外部文件).有没有一些在线工具,可以将文档和Javascript缩小到一小部分?我看到许多不可读的脚本,其中所有变量和函数名称都被替换为一个字母的名字等.请咨询.

解决方法

编辑2(2017年2月22日):现在,最好的工具可以减少您的资产(而且通过添加装载程序和插件,还有更多的工具)肯定是 Webpack.

将所有.css文件移动到一个文件中并将其缩小的配置示例:

{
  test: /\.css$/,use: [
    {
      loader: 'css-loader',options: {
        minimize: true
      }
    }
  ]
}

编辑1(2014年9月16日):更好的是,现在你有任务赛跑者,如GulpGrunt.

Task runners are small applications that are used to automate many of
the time consuming,boring (but very important) tasks that you have to
do while developing a project. These include tasks such as running
tests,concatenating files,minification,and CSS preprocessing. By
simply creating a task file,you can instruct the task runner to
automatically take care of just about any development task you can
think of as you make changes to your files. It’s a very simple idea
that will save you a lot of time and allow you to stay focused on
development.

必读:Getting started with Gulp.js

使用JavaScript连接和分类(和JSHint)的任务示例:

gulp.task('scripts',function() {
  return gulp.src('src/scripts/**/*.js')
    .pipe(jshint('.jshintrc'))
    .pipe(jshint.reporter('default'))
    .pipe(concat('main.js'))
    .pipe(gulp.dest('dist/assets/js'))
    .pipe(rename({suffix: '.min'}))
    .pipe(uglify())
    .pipe(gulp.dest('dist/assets/js'))
    .pipe(notify({ message: 'Scripts task complete' }));
});

原来的答案(2012年7月19日):我建议HTML5 Boilerplate Build Script可以减少你的JS和CSS.

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效