Dojo Build 简介

翻译自：https://github.com/dojo/frame...

Dojo 提供了一套强大的命令行工具，让构建现代应用程序更加简单。

能够自动建立包（Bundle），可使用 PWA 在本地缓存文件，能够在构建阶段渲染初始的 HTML 和 CSS，也可使用 Dojo 的 CLI 工具和 .dojorc 配置文件按条件忽略一些代码。或者脱离（eject） Dojo 的构建工具，直接使用底层的构建工具以作到彻底掌控。

功能	描述
Dojo CLI	模块化的命令行工具，用于快速启动新的应用程序、建立部件和运行测试等。
开发服务器	开发时使用的本地 web 服务器，用于监听文件系统，当检测到变化时会自动从新构建。也支持 HTTPS 和设置代理。
包(bundle)	经过减小用户须要下载的内容和优化用户实际须要的应用程序交互时间（Time-to-Interactive）以提升用户体验。能够根据路由自动建立包，或者在配置文件中明肯定义包。
按条件归入代码	经过 .dojorc 配置文件能够静态方式关闭或打开使用 dojo/has 定义的功能。因为这些配置而没法访问到的代码分支会被自动忽略掉。这就很容易为特定目标（如 IE11 或 mobile）提供特定功能，而不会影响包的大小。
PWA 支持	渐进式 Web 应用程序经过缓存内容甚至脱机工做，建立更快、更可靠的用户体验。经过配置文件或者在代码中定义，dojo 很容易建立一个 service work，并将其构建为应用程序的一部分。
构建时渲染	在构建时渲染路由以生成初始的 HTML 和 CSS。在构建时渲染，Dojo 能够节省出初始渲染的成本，建立出一个响应性更高的应用程序，且不会引入额外的复杂性。

基本用法

Dojo 提供了一组 CLI 命令，辅助建立和构建应用程序。本指南假设已全局安装 @dojo/cli，且在项目中安装了 @dojo/cli-build-app 和 @dojo/cli-test-intern。若是项目是使用 @dojo/cli-create-app 初始化的，那么这些依赖应该已经存在。

构建

Dojo 的 CLI 工具支持多种构建目标或 mode。在 dojo create app 为 package.json 生成的几个脚本（scripts）中可看到全部模式。

运行如下命令，建立一个为生产环境优化过的构建。

> dojo build --mode dist

这次构建使用 dist 模式建立应用程序包，并将结果输出到 output/dist 目录中。

运行服务和监听变化

当在 dev 或 dist 模式下运行时，可使用 --serve 标记启动一个 web 服务器。应用程序默认运行在 9999 端口上。可使用 --port 标记修改端口。使用 --watch 标记，Dojo 的构建工具也能够监听应用程序的变化并自动从新构建。

生成的 package.json 文件中包含 dev 脚本，它使用这些标记运行应用程序的构建版本，并监听到磁盘上的文件发生变化后会自动从新构建。

> dojo build --mode dev --watch file --serve

应用程序也会提供 source map。这样调试器就能够将构建的 JavaScript 代码映射回位于 src/ 文件夹下本来的 TypeScript 代码上。

测试

Dojo 使用 Intern 运行单元和功能测试。

T运行 tests/unit 中单元测试的最快方式，是使用新建 Dojo 应用程序时建立的 NPM 脚本。

命令行

# execute unit tests
npm run test:unit
# execute functional tests locally using headless Chrome and Selenium
npm run test:functional

支持的浏览器

Dojo 是一个持续演变的框架。默认状况下，发布的 dojo 版本会支持最新浏览器的最近两个版本。Dojo 要跨浏览器实现标准功能，其所需的 polyfill 都是经过 @dojo/framework/shim 按需提供的。要支持 IE11，须要打开 --legacy 标记。

Dojo 配置

可在 .dojorc 中添加其它配置选项。这些选项一般经过命令行扩展可用的设置，并支持更高级的功能，如国际化、代码拆分、PWA 清单和忽略代码等。

.dojorc 文件中包含一个 JSON 对象，能够为能在 dojo 命令行工具上运行的任何命令配置信息。在配置对象中为每一个命令分配一个节点，可在其中存储配置信息。

{
    "build-app": {
        "pwa": {
            "manifest": {
                "name": "My Application",
                "description": "My amazing application"
            }
        }
    },
    "test-intern": {},
    "create-widget": {
        "tests": "tests/unit"
    }
}

本示例中，@dojo/cli-build-app、@dojo/cli-test-intern 和 @dojo/cli-create-widget 三个 CLI 命令模块各对应一个节点。配置 老是 分层的，按照 command => feature => configuration 的顺序排列。