Browserify，minifyify，条件编译

Question

TL;DR

minifyify ( Browserify插件)使用uglify-js，但似乎无法处理条件编译。

• 压缩工程
• uglifyjs单独用于条件编译。
• minifyify提供了额外的编译优化，但我无法在其中使用条件编译。

我使用的是Browserify和babelify转换器以及minifyify插件。这是cmd，分为可读的部分：

browserify src/scripts/app/index.js -o build/prod/public/assets/js/appBundle.min.js -t [ babelify --presets [ es2015 ] ] -p [ minifyify --no-map --uglify [ --compress [ --drop_console --dead_code --conditionals --unused --if_return ] --mangle --screw-ie8 --define [ DEBUG=false ] ] ]

我已经有了所有的设定/选择。但是，我无法获得条件编译来工作。Minifyify使用uglifyjs的minify方法。我路过的事实不应该真的改变任何事情。

直接通过uglifyjs工程建造

uglifyjs input.js --compress --dead_code --define DEBUG=false -o output.js

但是，我失去了由minifyify提供的附加压缩/优化。

我也对另一个构建过程开放。我的需求将在当前进程的设置中恢复：

• CommonJS所需模块
• ES6到ES5的转换
• 高级小型化/压缩

Answer 1

事实证明，罪魁祸首或多或少是uglifyjs。任务中全局定义的属性名在CMD和Programmatic之间是不同的。

• cmd线：--define VARNAME=VALUE
• programmatic：compress: {global_defs: { varname: value } }

尽管如此，minifyify或浏览器化似乎并没有为全局定义正确传递cmd行选项--我们仍在研究这一点。

程序化解决方案

通过使用Browserify & minifyify编程API，构建任务可以工作。下面的任务与OP中的任务相同，但它的工作原理是：

"use strict";
var browserify = require("browserify"),
    fs = require("fs");

browserify("src/scripts/app/index.js")
    .transform("babelify", {presets: ["es2015"], plugins: ["transform-object-assign"]})
    .plugin("minifyify", {map: false, uglify: {
        compress: {
            drop_console: true,
            dead_code: true,
            conditionals: true,
            unused: true,
            if_return: true,
            global_defs: {
                DEBUG: false
            }
        },
        mangle: true,
        "screw-ie8": true
    }})
    .bundle()
    .pipe(fs.createWriteStream("build/prod/public/assets/js/appBundle.js"));

更新uglifyjs文档

我提议对当前的uglifyjs文档进行修改，并提供了一个使用上述编程API的示例，以避免将来其他人出现这个问题。