如何使用browserify获得缩小的输出？

Question

刚开始使用browserify,但我找不到如何让它溢出缩小输出的文档.

所以我看起来像:

$> browserify main.js > bundle.js --minified

Answer 1

通过uglifyjs管道:

 browserify main.js | uglifyjs > bundle.js

您可以使用npm安装它,如下所示:

 npm install -g uglify-js

Answer 2

从3.38.x开始,你可以使用我的minifyify插件来缩小你的捆绑包,并且仍然有可用的源图.其他解决方案无法实现这一点 - 您可以做的最好的事情是映射回未压缩的捆绑包.将地图一直缩小回您的单独源文件(是的,甚至是coffeescript!)

Answer 3

或者使用uglifyify转换"在Browserify处理之前"为您提供应用Uglify的"挤压"转换的好处,这意味着您可以删除条件要求的死代码路径.

Answer 4

在花了几个小时研究如何构建新的构建过程之后,我认为其他人可能会从我最终做的事情中受益.我正在回答这个老问题,因为它在谷歌看来很高.

我的用例比OP要求的更多.我有三个构建场景:开发,测试,生产.由于大多数专业开发人员都有相同的要求,我认为超出原始问题的范围是不可原谅的.

在开发过程中,每当JavaScript文件发生变化时,我都会使用watchify构建一个带有源映射的未压缩包.我不想要uglify步骤,因为我希望在我使用alt-tabbed到浏览器进行刷新之前完成构建,并且在开发期间它没有任何好处.要实现这一点,我使用:

watchify app/index.js  --debug -o app/bundle.js -v

为了测试,我想要与生产完全相同的代码(例如uglified),但我也想要一个源地图.我实现了这个:

browserify app/index.js  -d | uglifyjs -cm -o app/bundle.js      --source-map "content=inline,filename='bundle.js',url='bundle.js.map'"

对于生产,代码使用uglify进行压缩,并且没有源映射.

browserify app/index.js  | uglifyjs -cm > app/bundle.js

笔记:

我在Windows 7,MacOS High Sierra和Ubuntu 16.04上使用了这些说明.

我已经停止使用minifyify,因为它已不再维护.

可能比我分享的方式更好.我已经读过,在与browserify结合之前,通过uglifying所有源文件显然可以获得更好的压缩.如果你有更多的时间花在它上面,你可能希望调查一下.

如果您没有安装watchify,uglify-js或browserify已安装,请使用npm安装它们:

npm install -g browserify
npm install -g watchify
npm install -g uglify-js

如果您安装了旧版本,我建议您升级.尤其是uglify-js,因为他们对命令行参数进行了重大更改,这使得Google中出现的大量信息无效.

Answer 5

我喜欢terser，它支持 ES6+，并且还有一些良好的压缩功能。

browserify main.js | terser --compress --mangle > bundle.js

全局安装：

 npm i -g terser