【发布时间】:2013-09-14 21:41:34
【问题描述】:
我绝望地试图让 Dojo builds 的 Dijit template 内联功能为我的 AMD 项目工作,但还没有运气......
具体问题不在于 HTML 模板本身的内联,而是在成功内联后仍然使用 Ajax (XHR) 请求它们这一事实。
模板按以下方式内联:
"url:app/widgets/Example/templates/example.html": '<div>\n\tHello World!</div>'
Dijit 小部件本身在构建后定义如下模板:
define("dojo/_base/declare,dijit/_Widget,dojo/text!./templates/example.html".split(","), function (f, g, d) {
return f("MyApp.Example", [g], {
templateString: d,
});
});
我尝试使用:
- shrinksafe/闭包优化器
- 相对/绝对路径
- 使用旧的
cache()方法 - 使用
templatePath属性
但即使在内联模板的情况下运行成功构建(0 个错误和一些警告)后,Dojo / Dijit 仍会向这些资源发出 Ajax 请求。
这是我的构建配置文件:
var profile = {
basePath: '../src/',
action: 'release',
cssOptimize: 'comments',
mini: true,
optimize: 'closure',
layerOptimize: 'closure',
stripConsole: 'all',
selectorEngine: 'acme',
internStrings: true,
internStringsSkipList: false,
packages: [
'dojo',
'dijit',
'dojox',
'app'
],
layers: {
'dojo/dojo': {
include: [
'app/run'
],
boot: true,
customBase: true
},
},
staticHasFeatures: {
'dojo-trace-api': 0,
'dojo-log-api': 0,
'dojo-publish-privates': 0,
'dojo-sync-loader': 0,
'dojo-xhr-factory': 0,
'dojo-test-sniff': 0
}
};
由于这个问题,我的应用程序完全无法使用,因为要单独下载的文件太多(浏览器对并行连接的数量有限制)。
非常感谢您!
更新:
在我的index.html 中加载dojo.js 和run.js 的两行:
<script data-dojo-config='async: 1, tlmSiblingOfDojo: 0, isDebug: 1' src='/public/dojo/dojo.js'></script>
<script src='/public/app-desktop/run.js'></script>
这是新的build-profile:
var profile = {
basePath: '../src/',
action: 'release',
cssOptimize: 'comments',
mini: true,
internStrings: true,
optimize: 'closure',
layerOptimize: 'closure',
stripConsole: 'all',
selectorEngine: 'acme',
packages : [
'dojo',
'dijit',
'app-desktop'
],
layers: {
'dojo/dojo': {
include: [
'dojo/request/xhr',
'dojo/i18n',
'dojo/domReady',
'app-desktop/main'
],
boot: true,
customBase: true
}
},
staticHasFeatures: {
'dojo-trace-api': 0,
'dojo-log-api': 0,
'dojo-publish-privates': 0,
'dojo-sync-loader': 0,
'dojo-xhr-factory': 0,
'dojo-test-sniff': 0
}
};
我的新run.js 文件:
require({
async: 1,
isDebug: 1,
baseUrl: '/public',
packages: [
'dojo',
'dijit',
'dojox',
'saga',
'historyjs',
'wysihtml5',
'app-shared',
'jquery',
'jcrop',
'introjs',
'app-desktop'
],
deps: [
'app-desktop/main',
'dojo/domReady!'
],
callback: function (Main) {
debugger;
var main = new Main();
debugger;
main.init();
}
});
我的main.js 文件看起来像这样:
define([
'dojo/_base/declare',
'app-desktop/widgets/Application',
'app-desktop/config/Config',
'saga/utils/Prototyping',
'dojo/window',
'dojo/domReady!'
], function (declare, Application, ConfigClass, Prototyping, win) {
return declare([], {
init: function() {
// ... other stuff
application = new Application();
application.placeAt(document.body);
// ... some more stuff
}
});
});
在build-mode 中,我收到以下错误:
GET http://localhost:4000/app-desktop/run.js 404 (Not Found)
这很奇怪,因为这意味着构建过程使 dojo 具有外部依赖项,而不是构建文件中已经内联的 dojoConfig 变量。
在normal-mode 中,请求文件,但从未创建应用程序。
在这两种情况下,run.js 文件中设置的两个调试器都没有运行,这意味着由于某种原因从未调用过 callback 方法。
感谢您的帮助!
【问题讨论】:
-
如果您不在小部件中使用
"A,B,C".split(",")技巧会怎样? (换句话说,只是["A","B","C"])也许有一些解析/正则表达式的魔法正在发生并且破坏了它? -
我尝试将 string + split hack 替换为常规数组,但遗憾的是,这不起作用。
-
闭包编译器在编译期间将 "A,B,C".split(",") 表达式扩展为标准数组。它使代码更容易优化。
-
是的,我以为会是这样,但即使使用 shrinksafe 代替 Closure-compiler,这意味着在标准数组中定义了依赖项,您也会遇到相同的错误。
-
我看到 ""url:app/widgets/..." 并且在您的包中列出了 'app-desktop' - 我想知道这是否与此有关。另外,在搜索生成器代码,internStringsSkipList 似乎什么都不做,因此您可以将其省略,而 internStrings 默认为 true,因此也可以省略。
标签: templates build dojo google-closure-compiler