Javascript 在RequireJS中包含Modernizer，并在head标签中包含Modernizer

我对RequireJS和Modernizer有问题

我想让现代化资源占上风。还有身体里的其他东西。原因是现代化者在加载之前需要做一些事情。我希望能够使用RequireJS将Modernizer模块加载到其他模块中。如何在开发环境和生产环境中实现这一点？我使用requirejs来提取所有依赖项并缩小所有资源。yeoman版本将

替换为缩小版

在body标签下：

<!-- build:js ikl.app.js -->
<script data-main="scripts/main" src="scripts/vendor/require.js"></script>
    <!-- endbuild -->
    <script>
    requirejs.config({

        paths: {

            'jquery'        : 'vendor/jquery',
            'handlebars'    : 'vendor/handlebars',
            'ember'         : 'vendor/ember',
            'ember-data'    : 'vendor/ember-data',
            'modernizr'     : 'vendor/modernizr' // This should be removed


        },

        baseUrl: 'scripts',


        shim: {


            'jquery' : {

                exports : 'jQuery'

            },

            'ember': {

                deps: ['jquery', 'handlebars'],
                exports: 'Ember'

            },

            'ember-data': {

                deps: ['ember'],
                exports: 'DS'

            },

            'handlebars': {

                exports: 'Handlebars'

            },

            'modernizr': {
                exports: 'Modernizr'
            }

        }

    });

    require([

        'modules/system/controllers/system.controller',
        'jquery',
        'ember',
        'ember-data',
        'handlebars',
        'modernizr'

    ], 
        function( systemController ) {
            systemController.renderView();
        }

    );

    </script>

requirejs.config({
路径：{
“jquery”：“供应商/jquery”，
“车把”：“供应商/车把”，
“余烬”：“供应商/余烬”，
“余烬数据”：“供应商/余烬数据”，
'modernizer'：'vendor/modernizer'//应删除此项
},
baseUrl:“脚本”，
垫片：{
“jquery”：{
导出：“jQuery”
},
“余烬”：{
部门：['jquery'，'handlebar']，
出口：“余烬”
},
“余烬数据”：{
副部长：[余烬]，
出口：“DS”
},
“把手”：{
出口：车把
},
“现代化者”：{
出口：“现代化”
}
}
});
要求([
“模块/系统/控制器/系统.控制器”，
“jquery”，
“余烬”，
“余烬数据”，
“把手”，
“现代化者”
], 
功能（系统控制器）{
systemController.renderView（）；
}
);

您应该能够同时获得这两种功能

• 首先，删除与Modernizer相关的路径配置，您将不需要它
• 下一步在头部加载Modernizer-这将创建一个window.modernizer变量
• 最后，在引导需要之前，定义Modernizer模块

  define('modernizr', [], Modernizr);
  require(['foo', 'bar', 'modernizr'], function(foo, bar, modernizr) {
       //..profit
  }
  

---

为什么不在头部的脚本元素中同步加载Modernizer？您可能希望页面等待Modernizer运行，以便所有CSS类等都存在，并且不会因为各种CSS类突然出现而出现难看的“样式跳跃”。将其放在body标记上会提高性能。它呈现HTML的速度比应用JS逻辑更快。我不希望在加载Modernizer之前，尽可能少地使用JS逻辑来处理未格式化内容的headflash，这是一个令人信服的论点，即不呈现HTML。再想一想。我还应该指出，如果您正在优化脚本，请确保排除“Modernizer”，因为它不需要打包在优化包中。require优化器从一个文件开始，并遍历依赖关系树，将所有内容打包到一个优化（或缩小）文件中。这是一个建议的构建步骤，在推进部署之前，将请求量和大小降至最低。当优化器看到“Modernizer”时，它无法知道这是由页面外部提供的，它会像所有其他文件一样假定它在一个文件中，并且在找不到时会出错（这是正确的，也是您想要的）。解决方案是在优化器配置中使用

'exclude'

属性，告诉它不要担心

'modernizer'

。精彩的解释。非常感谢，我忘了提了。只有当手动提供的依赖项的

类型是
'object'