我研究了构建教程,发现了Web构建(仅限1.7.2),并测试了几个示例 - 但是,我找不到构建系统的简单解释.
假设我的应用是一个网页:
<script src="./js/App/other_non_amd_stuff_working_independently.js">
<script src="./js/lib/dojo/dojo.js" data-dojo-config="async: true"></script>
<script src="./js/App/Main.js">
Run Code Online (Sandbox Code Playgroud)
Dojo SDK位于./lib/,Main.js包含Dojo config + app boot:
require({
packages:[{
name:"App",
location:"../../App"
}]
},
[ "dojo/query",
"dijit/layout/BorderContainer",
"App/Foo",
"dojo/domReady!"], function(query, BorderContainer, Foo) { ... });
Run Code Online (Sandbox Code Playgroud)
我现在的问题就像这样简单:如何从我所有的Dojo/AMD东西中创建一个单独的脚本文件?我只是想替换
<script src="./js/lib/dojo/dojo.js" data-dojo-config="async: true"></script>
<script src="./js/App/Main.js">
Run Code Online (Sandbox Code Playgroud)
一个人
<script src="./js/Main.minified.js">
Run Code Online (Sandbox Code Playgroud)
让构建系统在这方面工作似乎有点不重要.它试图将./App/中的所有文件转换为AMD模块(这不是我想要的......)或者无法找到App/Main.我尝试构建一个构建配置文件(app.profile.js),但我不明白这一点,只是它增加了(IMO不必要的)复杂性.如何使构建系统只连接我的App/Main.js包含.依赖?
任何有关理解构建系统的更好教程的提示也值得赞赏.
我使用下面的(1.7)自定义构建配置文件来构建我的发布文件夹.
var profile = {
basePath: "..",
action: "release",
cssOptimize: "comments",
mini: true,
optimize: "closure",
layerOptimize: "closure",
stripConsole: "all",
selectorEngine: "acme",
packages:[
{
name: "dojo",
location: "./../../dojo"
},
{
name: "dijit",
location: "./../../dijit"
},
{
name: "dojox",
location: "./../../dojox"
}
],
layers: {
"dojo/dojo": {
include: [
"dojo/dojo",
"dijit/form/Button",
"dojox/form/TimeSpinner"
],
customBase: true,
boot: true
}
},
resourceTags: {
amd: function (filename, mid) {
return /\.js$/.test(filename);
}
} };
Run Code Online (Sandbox Code Playgroud)
在我的Web应用程序中,我只使用了两个组件,一个是来自'dijit'包的Button,另一个是来自'dojox'的TimeSpinner.所以,我已将这两个组件包含在'dojo/dojo.js'文件中,它正如我所期望的那样工作.
但是release文件夹包含文件夹'dojo','dijit'和'dojox',包含大量文件.
大多数组件未在我的Web应用程序中使用,但它们的文件存在于release文件夹中.即使它们不会被加载到浏览器中(因为AMD),我也不希望在我的发布文件夹中有这样的文件.
我的subversion中没有必要保留如此庞大的文件数量.
所以,我的问题如下:
请帮我...
我的dojo应用程序在构建之后中断,在加载应用程序期间,抛出'multipleDefine'并给出此错误:
错误{src:"dojoLoader",info:Object}
消息:multipleDefine
info:Object {pid:"dojo",mid:"dojo/nls/dojo_en-us",pack:Object,url:"dojo/nls/dojo_en-us.js",执行:5 ...}
这是我的个人资料:
var profile = {
// `basePath` is relative to the directory containing this profile file; in this case, it is being set to the
// src/ directory, which is the same place as the `baseUrl` directory in the loader configuration. (If you change
// this, you will also need to update run.js.)
basePath: '../src/',
// This is the directory within the release directory where built packages will be placed. The release directory
// …
Run Code Online (Sandbox Code Playgroud) 前段时间,我在使用Dojo和Dojo主题时研究了"无格式内容的闪现"的解决方案.有人建议通过创建构建来组合所有内容,并且它将减少加载/解析时间并消除使用预加载器覆盖等的需要.
然而,似乎Dojo严重缺乏简单,"真实世界"的用法示例和教程,以实现其许多功能,尤其如此.很多资源都告诉您如何设置构建,而不是如何实现它.
假设我在"pageinit.js"中有这个:
require([
'dojo/parser',
'dojo/dom',
'dojo/dom-class',
//etc...
'dijit/form/ValidationTextBox',
'dijit/form/CheckBox',
// etc...
// Dom Ready call
'dojo/domReady!']
function(
Parser,
Dom,
Class,
// etc...){
// do stuff with parser, dijits, so on.
}
)
Run Code Online (Sandbox Code Playgroud)
为简洁起见,删除了一些require调用,但是有一些dom
需求,style
类,一些dijits
等等.当这个页面加载时,有一些没有样式的内容,然后就可以了.
使用Dojo Web Builder,我选择了我正在使用的模块并运行它.它下载了一个包含大量文件的zip,包括一个新的dojo.js
和custom_layer.js
.
所以现在我的问题是,如何使用这些新的组合和缩小文件来代替我的"非构建"版本?我是require
什么?或者我呢?
如此迷茫...
这可能使用v1.6.1吗?由于我的客户端的dojo部署的Xdomain配置,每次dev代码更改时都需要执行新的构建.你可以想象,这是一个巨大的浪费时间.
从我能看到的一切来看,没有办法将核心从DOJO规则的构建中豁免.所以我想知道是否有办法打破规则(修改Rhino调用?)到达我需要的位置.
我已经设置了一个使用三个dojo小部件的html页面,我正在尝试使用dojo 1.7.5从它创建一个自定义构建.构建成功留下了一个dojo.js,其中包含使用此构建文件所需的文件:
var dependencies = {
action: "release",
selectorEngine: "acme",
stripConsole: "none",
cssOptimize: "comments.keepLines",
layers: [
{
name: "dojo.js",
dependencies: [
"dijit.form.ValidationTextBox",
"dijit.form.DropDownButton",
"dijit.form.Button",
"dijit.form.Form",
"dijit._base",
"dijit._Container",
"dijit._HasDropDown",
"dijit.form.ComboButton",
"dijit.form.ToggleButton",
"dijit.form._ToggleButtonMixin",
"dojo.parser",
"dojo.date.stamp",
"dojo._firebug.firebug"
]
}, {
name: "../test/test.js",
dependencies: [
"test.test"
]
}
],
prefixes: [
[ "dijit", "../dijit" ],
[ "dojox", "../dojox" ],
[ "ourpeople", "../ourpeople" ]
]
};
Run Code Online (Sandbox Code Playgroud)
我似乎无法找到答案的问题:
我是相当新的dojo构建系统和(特别是)所以也许我期待dojo构建系统不是设计用于或者可能会以错误的方式进行此操作,如果有任何提示或建议超过欢迎.
干杯!
Test.js:
function test1() {
console.log("test1");
}
Run Code Online (Sandbox Code Playgroud)
index.php文件:
<script type="text/javascript" src="js/release/dojo/dojo/dojo.js"></script>
<script type="text/javascript" src="js/release/dojo/test/test.js"></script> …
Run Code Online (Sandbox Code Playgroud) 这是我得到的构建失败的升华.症状是,当使用shrinksafe进行优化时,我的构建将失败,并显示错误:
[exec] js: "<eval'ed string>#1(Function)#1(eval)", line 127: uncaught JavaScript runtime exception: TypeError: Cannot read property "1" from null
[exec] at <eval'ed string>#1(Function)#1(eval):127
[exec] at <eval'ed string>#1(Function)#1(eval):163
Run Code Online (Sandbox Code Playgroud)
如果我的代码在其nls文件中使用如下模式
"dojo/i18n!./nls/MyResource"
Run Code Online (Sandbox Code Playgroud)
但是,这个构造在很多dojo代码中很常见,它们构建得很干净.所以我通过将一些dojo代码复制到我的模块中进行了实验,发现如果将nls资源加载到dojo/dojo层中,那么我的图层构建正确,如果我在自己的图层中加载了相同的nls资源,那么我们就会失败.
因此,我将dijit/form/_ComboBoxMenuMixin.js复制到我自己的模块以及相应的nls资源.
我有三个测试用例,一个工作,另外两个给出上面的失败.
我的问题:
似乎我需要在"dojo/dojo"层中包含我自己的nls资源,它必须恰好是这一层.当然这不可能是对的吗?我有什么选择?
工作简介:
layers: {
"dojo/dojo" : {
customBase: false,
include: [
"modules/nls/ComboBox",
],
exclude: []
},
"MyLayer" : {
customBase: false,
include: [
"modules/ComboCopy",
],
exclude: []
},
}
Run Code Online (Sandbox Code Playgroud)
失败:同一层中的nls
layers: {
"dojo/dojo" : {
customBase: false,
include: [
],
exclude: []
},
"MyLayer" : {
customBase: false, …
Run Code Online (Sandbox Code Playgroud)