在浏览器中优化后 requirejs r.js 错误答案

【问题标题】：requirejs r.js errors after optimization in browser在浏览器中优化后 requirejs r.js 错误
【发布时间】：2016-07-08 19:56:49
【问题描述】：

在使用 r.js 优化后，我正在努力让 requirejs 工作它在优化前工作得很好，

浏览器错误：

main.js:71 Uncaught ReferenceError: jQuery is not defined

在包含插件 mCustomScrollbar 到 main.js

工厂（jQuery、窗口、文档）；

file:///home/atm/public/www-build/js/jquery.mCustomScrollbar.js 净::ERR_FILE_NOT_FOUND require.js:2 未捕获的错误：“mCustomScrollbar”的脚本错误 http://requirejs.org/docs/errors.html#scripterror.

html:

<script data-main="js/main" src="js/require.js"></script>
<script>
    require(['main'],function(){
      require(['page/page1']);
    });
</script>

main.js 配置文件：

require.config({
    baseUrl: 'js/',
    paths : {
        page: 'page',

        'jquery' : ['https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min',
                    'jquery-2.2.1.min'],
        'mCustomScrollbar' : 'jquery.mCustomScrollbar',
        'jquery-mousewheel' : 'jquery.mousewheel.min'
    }, 
    shim : {
        'mCustomScrollbar' : {
                                deps : ['jquery','jquery-mousewheel']
                            }
    }
});

page1.js

define(['jquery','mCustomScrollbar'], function($){
    $(document).ready(function () { 
        $("#content-3").mCustomScrollbar({
            scrollButtons:{enable:true},
            theme:"dark-thick"
        }); 
    }); 
});

build.js 配置

({
    appDir: "../www",
    baseUrl: 'js/', // relative to appDir
    dir: "../www-build",
    mainconfigfile: '../www/js/main.js',
    modules: [
        {
            name: "main",
            include: ['jquery','mCustomScrollbar']
        },
        {
            name: 'page/page1',
            include: ['page/page1'],
            exclude: ['main']
        }
    ],
    paths: {
        'jquery': "empty:",
        'mCustomScrollbar' : 'jquery.mCustomScrollbar',
        'jquery-mousewheel' : 'jquery.mousewheel.min'
    },
    shim : {
        'mCustomScrollbar' : { deps : ['jquery','jquery-mousewheel'] }
    },
    optimize: "none",
    optimizeCss: "standard",
    removeCombined: true
})

【问题讨论】：

标签： javascript jquery requirejs

【解决方案1】：

main.js:71 Uncaught ReferenceError: jQuery is not defined

这可能是因为 jquery-mousewheel 在 jquery 之前加载。您可以尝试像这样为jquery-mousewheel 配置依赖项

shim : {
    'mCustomScrollbar' : {
        deps : ['jquery','jquery-mousewheel']
    },
    'jquery-mousewheel' : { 
        deps : ['jquery']
    }
}

【讨论】：

我部分解决了问题，主配置中没有包含 mCustomScrollbar 'mCustomScrollbar' : "empty:",

【解决方案2】：

我发现里面的脚本注释：

* load jquery-mousewheel plugin (via CDN) if it's not present or not loaded via RequireJS (works when * load jquery-mousewheel plugin (via CDN) if it's not present or not loaded via RequireJS

也许是用一个文件优化 js 文件的问题

【讨论】：

【解决方案3】：

好的，现在可以正常工作了，我解决了这个问题，包含在插件 mCustomScrollbar 中

 define ([ 'jquery', 'jquery-mouseWheel'], function () { 
    'inside code plugin mCustomScrollbar '  
 )};

现在所有文件库和插件都包含一个文件

【讨论】：