Dojo 创造项目, Build 使用 16
Dojo的编译系统, 以下简称build, 提供了组合Dojo以及你其它Javascript资源和CSS文件的方法。 以使这些资源在你应用程序的产品环境中更加高效的被使用。
"Building" Dojo 或 Javascript ?
基础
模块和包 Modules and Packages
Dojo配置 Dojo Configuration
层 Layers
创建配置文件 Profiles
文件最小化
无效代码路径删除
创建控制器,转化器 和解析器
你需要什么
布置你的应用程序
![](/assets/blank.gif)
包
包描述器
{"name": "app","description": "My Application.","version": "1.0","keywords": ["JavaScript", "Dojo", "Toolkit", "DojoX"],"maintainers": [{"name": "Kitson Kelly"}],"contributors": [{"name": "Kitson Kelly"},{"name": "Colin Snover"}],"licenses": [{"type": "AFLv2.1","url": "http://bugs.dojotoolkit.org/browser/dojox/trunk/LICENSE#L43"},{"type": "BSD","url": "http://bugs.dojotoolkit.org/browser/dojox/trunk/LICENSE#L13"}],"bugs": "https://github.com/example/issues","repositories": [{"type": "git","url": "http://github.com/example.git","path": "packages/app"}],"dependencies": {"dojo": "~1.9.2","dijit": "~1.9.2","dojox": "~1.9.2"},"main": "src","homepage": "http://example.com/","dojoBuild": "app.profile.js"
}
包配置文件
var profile = (function(){return {resourceTags: {amd: function(filename, mid) {return /\.js$/.test(filename);}}};
})();
注意我们使用了自动执行了一个匿名函数,是为了确保环境中的其它代码不会干扰到你的 profile. 这也给你提供了自已写更复杂的计算profile 对像的机会。
var profile = (function(){var testResourceRe = /^app\/tests\//,// checks if mid is in app/tests directorycopyOnly = function(filename, mid){var list = {"app/app.profile": true,// we shouldn't touch our profile"app/package.json": true// we shouldn't touch our package.json};return (mid in list) ||(/^app\/resources\//.test(mid)&& !/\.css$/.test(filename)) ||/(png|jpg|jpeg|gif|tiff)$/.test(filename);// Check if it is one of the special files, if it is in// app/resource (but not CSS) or is an image};return {resourceTags: {test: function(filename, mid){return testResourceRe.test(mid) || mid=="app/tests";// Tag our test files},copyOnly: function(filename, mid){return copyOnly(filename, mid);// Tag our copy only files},amd: function(filename, mid){return !testResourceRe.test(mid)&& !copyOnly(filename, mid)&& /\.js$/.test(filename);// If it isn't a test resource, copy only,// but is a .js file, tag it as AMD}}};
})();
如你看到的, 这看起来变得复杂了。 但基本的概念是profile对像需要包含 一个 resourceTags. 它包含了不同的标记函数。 然后你可以利用Javascript的强大功能计算出哪个资源儿得什么样的标签。
应用程序配置文件
Option | Type | Description |
---|---|---|
basePath
|
Path | 指定编译的根目录,编译的其余的路径都是相对于这个位置, 定义的路径是相对于配置文件的位置 |
releaseDir
|
Path | 编译的目的(输出文件)根目录, 编译器会尝试直接创建这个目录,如果存在,直接覆盖。它相对于basePath |
releaseName
|
String | 当输出时提供发布版本的名称。 名称会附加到releaseDir后面。 例如,如果你想发布代码到release/prd, 你可以设置releaseDir为release, releasename为prd |
action
|
String | 应该设置为release |
packages
|
Array | 一个数组对像,数组对像的元素为包信息的散列表。这些包信息在编译器映射模块时使用。 |
layers
|
Object | 它允许你创建不同的“layer" 模块组作为编译的一部分。一个layer为单个文件,文件里包含多个模块。 |
var profile = (function(){return {basePath: "./src",releaseDir: "../../app",releaseName: "lib",action: "release",packages:[{name: "dojo",location: "dojo"},{name: "dijit",location: "dijit"},{name: "dojox",location: "dojox"},{name: "app",location: "app"}],layers: {"dojo/dojo": {include: [ "dojo/dojo", "dojo/i18n", "dojo/domReady","app/main", "app/run" ],customBase: true,boot: true},"app/Dialog": {include: [ "app/Dialog" ]}}};
})();
如果我们创建profile文件, 并正常工作。 我们将编译后的文件输出到app/lib. app/lib会包含我们四个包中的所有模块。加上两个特殊的文件 app/lib /dojo/dojo.js 和 app/lib/app/Dialog.js, 这个文件里会包含所有必须的模块(build 版本), 如dojo.js 会包含dojo/dojo模块及依赖,dojo/i18n模块及依赖, dojo/domReady模块及依赖,app/main模块及依赖,app/run模块及依赖, 所有的这些模块的代码都是末被编译的。
编译优化
Option | Type | Description |
---|---|---|
layerOptimize
|
String/Boolean |
设置层为最小化, 默认为"shrinksafe". 如果为false,则关闭最小化。 另一个 有效的值是”shrinksafe.keeplines", "closure", "closure.keeplines", "comment" 和 "comment.keeplines". |
optimize
|
String/Boolean | 设置不是layer部分的模块最小化。 默认为 false. 接受跟layerOptimize 相同的值。 |
cssOptimize
|
String/Boolean |
对CSS文件做优化处理。 默认为false. 如果值为"comments",则删除注释,多余的行, 以及内联的@import命令。 如果值为"comments.keepLines",则删除注释,我内联的@imports. 但保留换行符。 |
mini
|
Boolean |
确定整个编译是否为"mini"(最小编译,不要编译), 如果为true, 不会复制标记了miniExclude的文件,如测试,DEMO , 以及不需要被编译(复制,最小化)的文件。 默认为false. |
stripConsole
|
String |
处理输出代码中的conole语名, 默认为"normal", 会删除所以console语句,除了console.error 和 console.warn. 最需注意的是,这个特征只在优化级别时才适用。否则它会被忽略。 另外可能的值为"none", "warn" 和"all" |
selectorEngine
|
String |
默认选择引擎,并编译到代码里,虽然它没有直接使代码变小,但它确保 了选择引擎不需要加载其它的引擎。 它默认为nothing, 会包含两个 dojo引擎 lite 和 acme. |
staticHasFeatures
|
Object |
特征散列表, 你可以为编译时强近的关闭这些特征检测。 当与Closure一起用时, 它允许你删除无效的代码。 之后会详细介绍它的值。 |
layerOptimize: "closure",
optimize: "closure",
cssOptimize: "comments",
mini: true,
stripConsole: "warn",
selectorEngine: "lite",
它将保证经过closurer后,我们的 layers 和 所有其它的模块都被最小化。 我们改善了 CSS资源的性能。 我们不会复制额外的资源,如demo和tests. 我们删除了代码中的console.warn语句, 并且明确的指定了我们将使用到的css选择器。
无效代码路径删除
Feature | Setting | Description |
---|---|---|
config-deferredInstrumentation
|
0 | 禁止自动加载dojo/promise/instrumentation模块. 该模块用于监测被拒绝的承诺,将末被处理的错误输出到控制台. 参考 deferred.js |
config-dojo-loader-catches
|
0 | Disables some of the error handling when loading modules. |
config-tlmSiblingOfDojo
|
0 | 禁止非标准化的模块名解析,dojo.js |
dojo-amd-factory-scan
|
0 | 假定所有的模块都为AMD格式, 可以参考dojo/dojo.js |
dojo-combo-api
|
0 | Disables some of the legacy loader API |
dojo-config-api
|
1 | 确保 build 是可配置的 |
dojo-config-require
|
0 |
Disables configuration via the require() .
|
dojo-debug-messages
|
0 | Disables some diagnostic information |
dojo-dom-ready-api
|
0 | Ensures that the DOM ready API is available |
dojo-firebug
|
0 | Disables Firebug Lite for browsers that don't have a developer console (e.g. IE6) |
dojo-guarantee-console
|
1 | Ensures that the console is available in browsers that don't have it available (e.g. IE6) |
dojo-has-api
|
1 | 保证has API 可以使用。可以查看dojo/has.js文件 |
dojo-inject-api
|
1 | 保证可以使用跨域来加载模块, 更详细的可以参考 dojo/dojo.js |
dojo-loader
|
1 | 确保使用的是Dojo 加载器,而不是第三方加载器。可以查看dojo/_base/loader.js |
dojo-log-api
|
0 | 禁止loader提供日志记录功能,即 require.log |
dojo-modulePaths
|
0 | Removes some legacy API related to loading modules |
dojo-moduleUrl
|
0 | Removes some legacy API related to loading modules |
dojo-publish-privates
|
0 | 禁止loader 对过 require公开内部的方法和变量, 可以查看dojo.js |
dojo-requirejs-api
|
0 | Disables support for RequireJS |
dojo-sniff
|
1 | 允许扫描dojo.js 角本中的 data-dojo-config 和 djConfig 标签, dojo.js |
dojo-sync-loader
|
0 | 禁止使用1.7版本之前的加载器, dojo.js |
dojo-test-sniff
|
0 | 禁止以测试为目的特征检测 |
dojo-timeout-api
|
0 | 禁止代码处理未加载的模块 |
dojo-trace-api
|
0 | Disables the tracing of module loading. |
dojo-undef-api
|
0 | Removes support for module unloading |
dojo-v1x-i18n-Api
|
1 | Enables support for v1.x i18n loading (required for Dijit) |
dom
|
1 | Ensures the DOM code is available |
host-browser
|
1 | Ensures the code is built to run on a browser platform |
extend-dojo
|
1 | Ensures pre-Dojo 2.0 behavior is maintained |
staticHasFeatures: {"config-deferredInstrumentation": 0,"config-dojo-loader-catches": 0,"config-tlmSiblingOfDojo": 0,"dojo-amd-factory-scan": 0,"dojo-combo-api": 0,"dojo-config-api": 1,"dojo-config-require": 0,"dojo-debug-messages": 0,"dojo-dom-ready-api": 1,"dojo-firebug": 0,"dojo-guarantee-console": 1,"dojo-has-api": 1,"dojo-inject-api": 1,"dojo-loader": 1,"dojo-log-api": 0,"dojo-modulePaths": 0,"dojo-moduleUrl": 0,"dojo-publish-privates": 0,"dojo-requirejs-api": 0,"dojo-sniff": 1,"dojo-sync-loader": 0,"dojo-test-sniff": 0,"dojo-timeout-api": 0,"dojo-trace-api": 0,"dojo-undef-api": 0,"dojo-v1x-i18n-Api": 1,"dom": 1,"host-browser": 1,"extend-dojo": 1
},
!* 虽然对于大部分应用来说都是安全的, 在所有的目标平都不会出现问题。 但我们还是在次提醒你, 当你使用staticHasFeatures,你已经从根本上改变了执行的路径(if(has(feature)){....}.
Layers
var profile = {layers: {"app/main": {include: [ "app/main" ],exclude: [ "app/mail", "app/calendar" ]},"app/mail": {include: [ "app/mail" ],exclude: [ "app/main" ]},"app/calendar": {include: [ "app/calendar" ],exclude: [ "app/main" ]}}
};
以上的例子, 编译系统会创建三个层: 一个包含了主要的应用, 一个包含 了mail组件, 一个包含 了日历组件。 在创建app/main layer时排除了app/mail 和 app/calendar层。 这些模块不会被加载到main layer里。
var profile = {layers: {"app/main": {include: [ "app/main", "dojox/grid/DataGrid" ],exclude: [ "app/mail", "app/calendar" ]},"app/mail": {include: [ "app/mail" ],exclude: [ "app/main" ]},"app/calendar": {include: [ "app/calendar" ],exclude: [ "app/main" ]}}
};
它也可以用于创建自定义的dojo.js. 特别是在使用AMD模式时。 因为默认情况下(为了向后兼容)。 dojo/main模块会被编译系统自动添加到 dojo.js文件, 这会使得你加载了代码,但又不用到这段代码。 为了自定义一个dojo.js , 你可以简单定义一个单独的layer. 设置 customBase 和 boot都为true.
var profile = {layers: {"dojo/dojo": {include: [ "dojo/dojo", "app/main" ],customBase: true,boot: true}}
};
customBase 阻止自动添加dojo/amin . boot 用于保证文件包含了必要的 AMD loader代码。 将app/main也添加到include 列表里,会直接将app/main模块(及它的依赖)代码添加到dojo.js文件中。
默认的配置(应用程序的dojoConfig默认配置)
defaultConfig: {hasCache:{"dojo-built": 1,"dojo-loader": 1,"dom": 1,"host-browser": 1,"config-selectorEngine": "lite"},async: 1
},
以上的内容适合于所有的 AMD应用程序。 如果你在你产品应用里只使用单个配置, 在编译时你很容易扩展配置。 然后当你加载应用时可以直接忽略他们。
综合使用
var profile = (function(){return {basePath: "./src",releaseDir: "../../app",releaseName: "lib",action: "release",layerOptimize: "closure",optimize: "closure",cssOptimize: "comments",mini: true,stripConsole: "warn",selectorEngine: "lite",defaultConfig: {hasCache:{"dojo-built": 1,"dojo-loader": 1,"dom": 1,"host-browser": 1,"config-selectorEngine": "lite"},async: 1},staticHasFeatures: {"config-deferredInstrumentation": 0,"config-dojo-loader-catches": 0,"config-tlmSiblingOfDojo": 0,"dojo-amd-factory-scan": 0,"dojo-combo-api": 0,"dojo-config-api": 1,"dojo-config-require": 0,"dojo-debug-messages": 0,"dojo-dom-ready-api": 1,"dojo-firebug": 0,"dojo-guarantee-console": 1,"dojo-has-api": 1,"dojo-inject-api": 1,"dojo-loader": 1,"dojo-log-api": 0,"dojo-modulePaths": 0,"dojo-moduleUrl": 0,"dojo-publish-privates": 0,"dojo-requirejs-api": 0,"dojo-sniff": 1,"dojo-sync-loader": 0,"dojo-test-sniff": 0,"dojo-timeout-api": 0,"dojo-trace-api": 0,"dojo-undef-api": 0,"dojo-v1x-i18n-Api": 1,"dom": 1,"host-browser": 1,"extend-dojo": 1},packages:[{name: "dojo",location: "dojo"},{name: "dijit",location: "dijit"},{name: "dojox",location: "dojox"},{name: "app",location: "app"}],layers: {"dojo/dojo": {include: [ "dojo/dojo", "dojo/i18n", "dojo/domReady","app/main", "app/run" ],customBase: true,boot: true},"app/Dialog": {include: [ "app/Dialog" ]}}};
})();
编译角本的执行步骤 :
- 指定build的根目录
- 指定输出的目录,app/lib
- 优化layers和所有模块时用Closure Compiler( goolge)
- 删除CSS中的注释和内嵌的@imports.
- 不需要复制额外资源,如测试和demos.
- 从代码里删除console.log 行
- 利用lite css选择器引擎
- 提供一个默认的dojoConfig
- 不需要的特征检测会通过 Closure Compiler删除。
- 标识的每个包会成为编译版本的一部分
- 创建两个层, 一个称为app/lib/dojo/dojo.js, 它包含我们应用程序的主体代码,加上必须的引用的dojo代码。 另一个称为app/lib/app/Dialog.js, 它包含一些额外的代码,用于支持app/Dialog模块。
- 使用 -- require 命令行标志来指定一个包含 require对象的角本或者调用require(config)
- 使用 -- dojoConfig 命令行标志指定一个角本,script包含 dojoCOnfig对像和包配置数据 dojoConfig={ packages:[{name:"dojo", location:"dojo"}] }
- 使用多个 -- package 命令行标志指定每个包的目录(注意每个包必须包含 package.json文件)
- 在profile文件里指定包的配置,这正是我们上面所做的。
编译
$ src/util/buildScripts/build.sh --profile myapp.profile.js
在Windows系统:
> src\util\buildScripts\build.bat --profile myapp.profile.js
通过我们为应用程序创建 的profile,开始编译。 在实际应用中,命令行还可以指定不同的配置选项。 -- help ( 或在windows上 build.bat --help)会获得所有命令列表。 虽然我们推荐你使用简单的方式,并把所有的选项放 profile里。 但是也有可能需要在编译前确认执行参数 --check-args. 它会以JSON格式输出处理编译的各个配置。
总结
其它资源
- Defining Modules tutorial
- Configuring Dojo with dojoConfig tutorial
- Reference Guide for dojo/has
- Reference Guide for the build system
- Dojo Boilerplate
Dojo 创造项目, Build 使用 16相关推荐
- 【报错笔记】运行Maven项目时发现项目Build错误
运行Maven项目时发现项目Build错误 错误原因:在pom.xml中没有定义maven运行插件 解决方案:在pom.xml写上以下依赖 <build><finalName> ...
- Vue 项目 build 流程解析(webpack工具解析)
Vue 项目 build 流程解析(webpack工具解析) 注:本篇文章解析框架为 vue2.0 本篇文章通过解析简单的项目打包步骤试着去了解我们的 Vue 项目是怎么打包的. build.js 干 ...
- Delphi 项目 Build Configurations 构建配置 .DPROJ 文件
Delphi 项目 Build Configurations 构建配置 .DPROJ 文件 一.工程项目 构建配置-基础:调试,发行 ( Build Configurations - Base: De ...
- 关于Maven项目build时出现No compiler is provided in this environment的处理
近日有同事遇到在编译Maven项目时出现 [ERROR] No compiler is provided in this environment. Perhaps you are running on ...
- unity项目build成webgl时选择生成目录(解决方法)
在unity里点击File>>Build Settings...>>勾选你要生成的Scenes>>选择webgl>>后面Development Buil ...
- Vue项目build后静态资源文件路径或新建文件夹图片路径找不到的问题
问题描述:使用vue-cli脚手架工具生成的vue项目,使用npm run build后生成的文件直接双击打开白屏一片. 解决方案: 第一步:修改build文件夹下utils.js,在以下位置加入 i ...
- java项目导入包报错_转!java web项目 build path 导入jar包,tomcat启动报错 找不到该类...
在eclipse集成tomcat开发java web项目时,引入的外部jar包,编译通过,但启动tomcat运行web时提示找不到jar包内的类,需要作如下配置,将jar包在部署到集成的tomcat环 ...
- maven web项目build失败
通过maven build发布web项目到tomcat时报如下异常: [INFO] ---------------------------------------------------------- ...
- eclipse项目build时,提示错误.
2019独角兽企业重金招聘Python工程师标准>>> Errors occurred during the build. Errors running builder 'Integ ...
最新文章
- 两位MIT学霸,25岁退学,40岁完成800亿IPO!
- 动漫:史上最简(详细)KMP算法讲解,看不懂算我输!
- Mysql元数据分析
- linux shell awk next,使用awk的next命令的方法
- C语言结构体-大小,对齐,填充,使用及其他
- 【Android】进入Material Design时代
- 数据库周刊第十七期来啦!
- 中国超级计算机何时被超越,超级计算机神威太湖之光被超越?看了表示,下一代更超乎想象!...
- 4. laravel 路由(1)
- c语言中dist有是什么作用,C语言习题及答案(第九章).doc
- Red5java.util.concurrent.RejectedExecutionExceptio
- java date类1900,java - 使用javax.validation验证日期不得少于1900-01-01 - 堆栈内存溢出...
- 解析大型Java项目架构演进(以淘宝网为例)
- ip地址与交换机工作原理
- idea出现outdated version提示框
- ES2015部分新特性示例
- python的撤销和回退_撤销和回退
- 机械臂抓取学习笔记四
- PHP:include包含文件局部引入全局变量失效的作用域问题
- 对脚手架的使用的几点建议
热门文章
- linux网卡e1000下载,Linux E1000网卡驱动分析
- 用css3,transform3d制作房屋全景展示效果(一)
- wwwxxx_www
- dom html api,JavaScript常用DOM的API
- 量子计算机运行速度解方程,量子计算机可解方程组
- 上海老牌IB名校:世外系学校大盘点
- vue实现mp4视频截图
- opencv4.4百度网盘链接
- 在c 语言中 引用数组元素时,【单选题】在 C 语言中,引用数组元素时,其数组下标的数据类型不允许是
A. 整型常量 B. 整型表达式 C. 整形符号常量 D. 整型变量...
- 对话系统 | (2) 对话系统之用户模拟器