Question

如何调用requireJS require（['app']，function（）{}）;只有一次在整个应用程序的开头，以便任何后续的需要（[“...”]，函数（...）{}）;不需要包含在require（['app']？

中）

这是我的设置：

1）加载require.js

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

2）正确配置app.js垫片和basUrl。

requirejs.config({ 

  baseUrl: "scripts/js",

  paths: { 
    "jquery": "../bower_components/jquery/dist/jquery.min",
    "modernizr": "../bower_components/modernizr/modernizr", 
    .
    . 
    .
  },
  shim: {
    "jquery.migrate": ['jquery'], 
    .
    .
    .
  }
});

3）在不同页面上动态加载JS：

// Home Page
require(['app'], function() {

    require(["jquery", "foundation", "foundation.reveal"], function ($, foundation, reveal){
         $(document).foundation(); 
    }); 
});


// Catalog Page
require(['app'], function() {

    require(["jquery", "lnav/LeftNavCtrl","controllers/ProductCtrl", "controllers/TabsCtrl"], function ($, NavCtrl, ProductCtrl, TabsCtrl){
        $(function() {
            NavCtrl.initLeftNav(); 
        });
    }); 
});

除非我用require（['app']，function（））换行，否则每次调用require（“...”）加载外部JS或AMD模块时，应用程序都不会被初始化，我会收到JavaScript错误。上面的代码有效，但效率不高。

在我尝试加载脚本之前，有没有办法启动我的requireJS应用程序？

我在加载require.min.js后立即尝试调用：

require(["app"], function (app) {
    app.run();
});

但它不起作用。

Answer 1

RequireJS中没有任何条款确保在加载任何其他模块之前始终加载特定模块，而不是让第一个模块加载其余模块。您要做的是在多个页面之间共享您的第一个模块，以便它无法执行加载每个页面特定内容的工作。

解决此问题的一种方法是只使用常规app.js元素加载script：

<script src="requirejs/require.min.js"></script>    
<script src="js/app.js"></script>

然后，下一个script元素可以启动您的应用程序而无需app.js：

<script>
   require(["jquery", "foundation", "foundation.reveal"], function ($, foundation, reveal){
     $(document).foundation(); 
   }); 
</script>

这实际上是我决定在我现在正在处理的应用程序中启动模块的方式。确实，由于额外的网络往返，它没有尽可能优化，但在我正在开发的应用程序的情况下，它们仍处于非常重大开发中，我希望稍后再进行此优化。

请注意通常您不想使用script加载RequireJS模块，但您的app.js不是真正的模块，因为它不会调用{{ 1}}，所以这没关系。

另一种选择是使用像Grunt，Gulp，Make或其他类似的构建工具，每页创建一个define并让每个页面加载自己的app.js文件。此文件将包含配置和第一次app.js调用，以加载特定于您页面的模块。

呼叫要求（['app']）仅一次

1 个答案: