Javascript 构建RequireJS(AMD)模块并加载它
我在两个不同的存储库中有两个Javascript项目(A和B)。每个都使用RequireJS和grunt contrib RequireJS插件来运行优化器。我想要构建项目B,将其作为Bower依赖项添加到项目a中,然后在单击按钮时异步加载B 项目A的requirejs grunt配置如下所示:Javascript 构建RequireJS(AMD)模块并加载它,javascript,requirejs,gruntjs,bower,Javascript,Requirejs,Gruntjs,Bower,我在两个不同的存储库中有两个Javascript项目(A和B)。每个都使用RequireJS和grunt contrib RequireJS插件来运行优化器。我想要构建项目B,将其作为Bower依赖项添加到项目a中,然后在单击按钮时异步加载B 项目A的requirejs grunt配置如下所示: requirejs: { compile: { options: { optimize : "uglify2", preserve
requirejs: {
compile: {
options: {
optimize : "uglify2",
preserveLicenseComments: false,
baseUrl : "<%= PATHS.BUILD %>/js",
uglify2 : {
output : {
"max_line_len" : 0
}
},
paths: {
"backbone" : "empty:",
"bootstrap" : "empty:",
"hbs" : "../../../bower_components/require-handlebars-plugin/hbs",
"i18n" : "empty:",
"jquery" : "empty:",
"marionette" : "empty:",
"moment" : "empty:",
"underscore" : "empty:",
"templates" : "../templates",
"locales" : "../locales"
},
hbs : {
"templateExtension" : "template"
},
shim: {
"bootstrap" : ["jquery"]
},
deps: ["config"],
name: "main",
out: "<%= PATHS.BUILD %>js/<%= pkg.name %>.min.js"
}
}
}
(完)
当我在项目A中加载模块时,我得到:
require(["../projectB/js/projectb.min"], function(ProjectB) {
console.log("running Project B...");
ProjectB.start();
});
未捕获错误:缺少highcharts
老实说,我真的不明白“结束包装”中的define调用是怎么回事。我是否需要在项目A的requirejs文件中指定项目A和项目B的依赖项的联合?我想让ProjectA尽可能苗条,然后把ProjectB打包
有什么想法吗?调试时会发生什么?为什么它得不到高分呢?你能放一个更长的堆栈跟踪吗?正如我所看到的B,它只是一组外部库,这个库是静态的还是动态变化的?你在projectA上使用grunt+Concation吗?你试过给Highchart提供路径吗?
(function(window, factory) {
if (typeof define === 'function' && define.amd) {
// AMD
define(factory);
} else if (typeof exports === 'object') {
// CommonJS
module.exports = factory();
} else {
// Browser Global (ProjectB is your global library identifier)
window.ProjectB = factory();
}
}(this, function() {
//Register in the values from the outer closure for common dependencies
//as local almond modules
define('jquery', function () {
return $;
});
define('underscore', function () {
return _;
});
define('backbone', function () {
return Backbone;
});
// Ask almond to synchronously require the
// module value for 'ProjectB' here and return it as the
// value to use for the public API for the built file.
return require('ProjectB');
}));
require(["../projectB/js/projectb.min"], function(ProjectB) {
console.log("running Project B...");
ProjectB.start();
});