Browserify、minifyify、条件编译

Question

TL;DR

minifyify（Browserify 插件）使用 uglify-js 但似乎无法处理 Conditional compilation:

• 压缩有效
• 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 ] ] ]

我已经 setting/option 开始工作了。但是，我无法使条件编译工作。 Minifyify 使用 uglifyjs 的 minify 方法。我路过 minifyify 的事实不应该真正改变任何东西。

直接通过 uglifyjs 构建有效

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

但后来我失去了 minifyify 提供的额外 compressions/optimizations。

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

• CommonJS 所需的模块
• ES6 到 ES5 的转译
• 高级minification/compression

Answer 1

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

• 命令行：--define VARNAME=VALUE
• 程序化：compress: {global_defs: { varname: value } }

话虽如此，minifyify 或 browserify 似乎也没有为全局定义正确传递 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 的示例，以避免将来其他人遇到此问题。