Question

我已经挣扎了好几天才想出来，但最后我今天需要你的帮助我的回购：https://github.com/seoyoochan/bitsnut-web

我想要实现的目标：
- 加载并优化r.js. - 为RequireJS和r.js编写凉亭任务：
任务是：minify＆amp; uglify＆amp; RequireJS的串联，并在生产中使用r.js进行优化
- 如何在使用index.html任务时在wiredep中排除js脚本标记并通过RequireJS加载程序加载它们？

我使用Yeoman'Webapp'生成器并生成了脚手架应用程序。

我通过bower install安装了主干，木偶，文字，下划线等我通过删除bower.json修改了dependencies，并在"requirejs": "~2.1.16"上仅保留了dependencies。（devDependencies为空）

因为我使用[2][grunt-wiredep]，所有内容都会自动加载bower_components到index.html。我修改了.bowerrc以将依赖项存储在app/scripts/vendor。

然而，问题是我不知道如何通过ReuqireJS成功加载它们而不是将供应商作为脚本标签加载到index.html中。我必须为RequireJS和r.js编写一些任务，但不知道如何实现这个目标（虽然安装了grunt-contrib-requirejs）

我想按照第4种方法在https://github.com/jrburke/requirejs/wiki/Patterns-for-separating-config-from-the-main-module使用r.js。但我遇到的问题是RequireJS的文档建议不要使用named module，而是使用anonymous module。我想听听关于我应该如何处理的各种意见。

我非常感谢您的帮助！

Answer 1

您手动加载脚本here和here，使整个requireJS无用。您还先加载main here config.js#L49。

相反，您应该只在index.html

中包含此行

<script data-main="scripts/config" src="scripts/vendor/requirejs/require.js"></script>

使用main和define()加载该文件中的所有依赖项（就像使用require()一样）。正如您设置exports（将值设置为全局变量）一样，函数可以为空。这是一个样本：

define([
    "jquery",
    "underscore", 
    "backbone",
    "marionette",         
    "modernizr"
], function () {
        require([
        "backbone.babysitter", 
        "backbone.wreqr", 
        "text", 
        "semantic"
    ], function () {
        /* plugins ready */
    });

    define(["main"], function (App) {
           App.start();
    });
});

baseUrl与您的data-main属性文件夹（http://requirejs.org/docs/api.html#jsfiles）的目录相同：

RequireJS加载相对于baseUrl的所有代码。 baseUrl是通常设置为与data-main中使用的脚本相同的目录要为页面加载的顶级脚本的属性。数据主要 attribute是require.js将检查启动的特殊属性脚本加载。

所以我认为baseUrl中的config.js指向scripts/scripts/ - 不存在的文件夹。它可能/应该是vendor/（并从所有声明中删除供应商部分）或者只是留空。

您可以尝试使用https://github.com/yeoman/grunt-bower-requirejs而不是wiredep来代替wiredep，而是专门针对bower/requirejs个应用（请参阅：https://github.com/stephenplusplus/grunt-wiredep/issues/7）

您的回购邮件不包含jQuery的dist文件夹，但此处是config.js require(["dependency1", "dependency2"])的工作样本：http://jsfiddle.net/petetnt/z6Levh6r/

至于模块定义，它应该是

main

并且模块应该返回自己。目前，您的require(["main", "backbone", "marionette"], function(App, Backbone, Marionette){文件将自己设置为依赖项

backbone

由于您已将marionette和exports设置为带require(["backbone", "marionette"], function(){ "use strict"; var App = new Backbone.Marionette.Application(); App.addInitializer(function(){ console.log("hello world!"); Backbone.history.start(); }); return App; });的全局变量，因此您可以再次将函数属性设置为空，因此您的主文件应如下所示：

define

由于您已使用main加载require，因此请再次App.start()。而只需在define函数内调用{{1}}。

https://jsfiddle.net/66brptd2/（config.js）

＆＃39;定义＆＃39;在RequireJS上没有定义错误＆amp; Webapp Yo发电机

1 个答案: