我试图建立一个独立的模块与杏仁,这是我的设置。问题在最底层。
精简的目录结构是:
|-static
|-core
|-js
|-require.js
|-almond.js
|-common.js
|-app.build.js
|-app
|-myApp.js
|-vendor
|-js
|-jquery.js
|-bootstrap.js
|-fancybox.jsCommon.js的缩写内容:
require.config({
baseUrl: "/static/core/js",
paths: {
'jquery':'../../vendor/jquery/1.7.2/jquery',
'bootstrap':'../../vendor/bootstrap/2.2.2/js/bootstrap',
'fancybox':'../../vendor/fancybox/2.0.6/jquery.fancybox',
},
shim: {
'bootstrap':['jquery'],
'fancybox': ['jquery'],
'app/messages': ["jquery"],
},
waitSeconds: 12
});app/myApp.js的缩写内容(是的,我知道我正在污染全局名称空间):
define(function (require) {
var $ = require('jquery');
require('fancybox');
require('app/messages');
//all myApp's code here
console.log('Is this thing on?')
});我的构建文件: app.build.js:
mainConfigFile: 'common.js',
removeCombined: true,
skipDirOptimize: true,
wrapShim: false,
wrap: false,
modules: [
{
name: 'almond',
include: ['app/myApp'],
out: ['myApp.js'
},
],更新(添加了html):模板的底部:
{% require_module 'myApp' %}模板标记转换为:
<script src="/static/core/js/myApp.js"></script>当我执行构建时,我使用杏仁、所有myApp的依赖项和myApp的所有代码获得完整的构建。但是,依赖项加载并执行它们的代码,但是myApp的代码不执行。
我希望在myApp的依赖项加载之后,我会看到“这个东西开着吗?”(见上面的app/myApp.js )在控制台中,但没有骰子.
注意:我实际上是在使用django--需要构建独立模块,但是我认为app.build.js非常接近它正在做的事情,并且考虑到最终的myApp.js文件包含了所有必要的部分--它不应该有什么不同。
发布于 2014-03-14 21:56:27
尝试将定义类更改为require类:
require( ["jquery", "fancybox", "app/messages"], function ($, fancybox, messages) {
//all myApp's code here
console.log('Is this thing on?')
});将包含require.config的文件放在脑中,而不是使用require的任何其他文件。然后,确保保存新的require函数的文件在HTML中以供参考。
至少在过去,这就是我所使用的要求。
https://stackoverflow.com/questions/22416207
复制相似问题