为什么我的 RequireJS 会忽略优化后的 main.js 中的代码？

Question

我最近一直在使用 RequireJS，但我是优化器的新手，我正在尝试将它添加到我的构建步骤中，但我遇到了一个问题。在它运行并将我的 JS 文件合并为一个之后，我的“main”主体不再执行（在优化之前工作正常）。所有依赖 JS 都正确加载，但我的 main define() 中的实际代码没有（即使我可以在最终输出文件中看到它。这就是我的意思：

假设我的 main.js 的简化版本：

console.log("This statement outputs to console");
define(["jquery", "modernizr", "jquery.joyride"], function($) {
    console.log("This statement does not");
}

正如我所提到的，我将在输出文件的内联中看到 jquery、modernizer、joyride 和两个 console.log() 语句，因此我相信它会正确生成。我的猜测是它与我的要求配置有关：

这是我的 app.js 的简化版本：

requirejs.config({
    "baseUrl": "/assets/js",
    "paths": {
        "jquery": "jquery"
    },
    "shim": {
        "jquery.joyride": ["jquery"]
    }
});

requirejs(["app/main"]);

我的假设是第二个 requirejs() 调用没有被执行。那可能吗？什么会导致这种情况发生？正确的解决方法是什么？

基本上我的 main.js 优化版本如下所示：

(function(e,t){ ..jquery code.. };

define("jquery.joyride", function(){});
(function(a){ ...code here... });

console.log("This statement outputs to console");
define('main',["jquery", "modernizr", "jquery.joyride"], function($) {
    console.log("This statement does not");
};

这是构建配置：

({
    appDir: '../../',
    baseUrl: "assets/js",
    mainConfigFile: '../../assets/js/app.js',
    dir: '../../../BUILD/',
    optimizeCss: 'default',
    modules: [
        {
            name: "main"
        }
    ],
    removeCombined: true,
    preserveLicenseComments: false,
    optimize: 'none' // I Disabled this to help me try and debug
})

它也有帮助，这是我用来包含我的 JS 的行（在我优化文件之前和之后完全相同的行）：

<script data-main="/assets/js/app" src="/assets/js/require.js"></script>

Answer 1

所以通过仔细查看您在上面共享的代码...问题是 main.js 的优化版本没有添加正确的模块名称（define("main"[ 应该是define("app/main"[。我怀疑这有与两件事之一有关：

1. r.js 配置文件中的模块名称错误
2. app.js 中的模块引用不正确

首先，测试/证明我的假设：手动编辑 main.js 的优化版本以匹配我上面提到的内容（“app/main”代替“main”）。如果可行，请尝试以下方法（一次一个，而不是同时）：

1. 为了解决 #1，在您的 r.js 配置文件中...将 name:"main" 更改为 name:"app/main"
2. 对于 #2，在您的 app.js 中，将 requirejs(["app/main"]); 更改为 requirejs(["main"]);