如何使用gulp缩小网页包输出?
我的任务是:如何使用gulp缩小网页包输出?,gulp,webpack,minify,uglifyjs,gulp-uglify,Gulp,Webpack,Minify,Uglifyjs,Gulp Uglify,我的任务是: gulp.task('js', function() { var webpackConfig = extend({}, require('./webpack.config.dev.js'), { devtool: "source-map", }); return gulp.src(config.paths.mainJs) //.pipe(beautify({indent: {value: ' '}})) .pipe(named()) .
gulp.task('js', function() {
var webpackConfig = extend({}, require('./webpack.config.dev.js'), {
devtool: "source-map",
});
return gulp.src(config.paths.mainJs)
//.pipe(beautify({indent: {value: ' '}}))
.pipe(named())
.pipe(webpack(webpackConfig))
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(through.obj(function (file, enc, cb) {
// Dont pipe through any source map files as it will be handled
// by gulp-sourcemaps
var isSourceMap = /\.map$/.test(file.path);
if (!isSourceMap) this.push(file);
cb();
}))
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest('./deployment/deployment/js'))
.pipe(uglify())//JS_Parse_Error
前面管道的输出是两个文件:bundle.js和bundle.js.map。所以我认为我对丑八怪的看法是错误的。如何缩小webpack输出?我所要做的就是修改gulp中已引用的“/webpack.config.dev.js”文件以添加UglifyJsPlugin:
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.optimize.UglifyJsPlugin({
mangle: {
except: ['$super', '$', 'exports', 'require']
}
})
],
我只是想评论一下,与gulp minify相比,webpack的速度慢了大约25%。实际上,我将minify从webpack移动到gulp以帮助提高构建性能。@ahskaus您是如何做到的?@x29a使用jsminify插件缩小webpack输出目录中的js文件。@ahskaus我将补充x29a的问题:您是否有一个解决方案仍然允许您使用从缩小版本映射到之前的原始代码,例如带有网页的babeling等?