html 一般如何压缩到无空格状态，好多网站都是这样的，如何一键发布

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 3689 天前的主题，其中的信息可能已经有所发展或是发生改变。

又如何一键删除注释

空格

注释

压缩

12 条回复 • 2014-11-15 10:05:05 +08:00

chshouyu

2014-11-14 17:49:38 +08:00

https://npmjs.org/package/grunt-contrib-htmlmin

ilihai

2014-11-14 18:25:19 +08:00

mod_pagespeed也有这功能，就是不知道能不能达到你的要求。

66beta

2014-11-14 18:27:17 +08:00

你需要gulp跑task

// Scan Your HTML For Assets & Optimize Them
gulp.task('html', function () {
var assets = $.useref.assets({searchPath: '{.tmp,app}'});

return gulp.src('app/**/*.html')
.pipe(assets)
// Concatenate And Minify JavaScript
.pipe($.if('*.js', $.uglify({preserveComments: 'some'})))
// Remove Any Unused CSS
// Note: If not using the Style Guide, you can delete it from
// the next line to only include styles your project uses.
.pipe($.if('*.css', $.uncss({
html: [
'app/index.html',
'app/styleguide.html'
],
// CSS Selectors for UnCSS to ignore
ignore: [
/.navdrawer-container.open/,
/.app-bar.open/
]
})))
// Concatenate And Minify Styles
// In case you are still using useref build blocks
.pipe($.if('*.css', $.csso()))
.pipe(assets.restore())
.pipe($.useref())
// Update Production Style Guide Paths
.pipe($.replace('components/components.css', 'components/main.min.css'))
// Minify Any HTML
.pipe($.if('*.html', $.minifyHtml()))
// Output Files
.pipe(gulp.dest('dist'))
.pipe($.size({title: 'html'}));
});

66beta

2014-11-14 18:29:58 +08:00

当然Sublime Text的话，还有Minifier插件之类
反之，HTML-CSS-JS Prettify