介绍
Dojo 提供强大的 CLI 工具和支持,使构建现代应用程序变得容易。
捆绑包可以自动创建,PWA 可以将应用程序文件缓存在本地,初始 HTML 和 CSS 可以构建时渲染,并且可以通过 Dojo 的 CLI 工具和 .dojorc
配置文件有条件地省略代码。或者通过弹出并直接使用底层构建工具来完全控制。
功能 | 描述 |
---|---|
Dojo CLI | 一个模块化的命令行工具,用于启动新应用程序、创建小部件和运行测试。 |
开发服务器 | 一个本地开发 Web 服务,它监视文件系统并在检测到更改时自动重建。还包括对 https 和代理请求的支持。 |
捆绑包 | 通过减少用户需要下载的内容并改善 TTL 来创建更好的用户体验。捆绑包可以通过路由自动创建,也可以在配置中显式定义。 |
条件代码包含 | 通过 dojo/has 定义的功能可以通过 .dojorc 配置文件静态地关闭/打开。由于这些设置而无法访问的代码分支将自动省略。这使得支持 IE11 或移动设备等特定目标的功能变得容易,而不会影响捆绑包大小。 |
PWA 支持 | 渐进式 Web 应用程序通过缓存内容甚至离线工作来创建更快、更可靠的用户体验。Dojo 使通过配置创建服务工作者变得容易,或者在代码中定义它并将其作为应用程序的一部分构建。 |
构建时渲染 | 构建时渲染路由以生成初始 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
脚本中看到。
运行以下命令以创建一个针对生产环境优化的构建。
> dojo build --mode dist
此构建将使用 dist
模式创建一个应用程序捆绑包,并将结果输出到 output/dist
目录中。
服务和监视
可以在 dev
或 dist
模式下运行时使用 --serve
标志启动 Web 服务器。默认情况下,应用程序在端口 9999 上提供服务。这可以通过 --port
标志更改。Dojo 的构建工具还可以监视应用程序以进行更改,并在使用 --watch
标志时自动重建。
生成的 package.json
包含 dev
脚本,该脚本使用这些标志来提供应用程序的构建版本,并在磁盘上的文件发生更改时自动重建它。
> dojo build --mode dev --watch --serve
应用程序还将提供源映射。这允许调试器将构建的 JavaScript 代码映射回位于 src/
目录中的原始 TypeScript 代码。
测试
Dojo 使用 Intern 来运行单元测试和功能测试。
在 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 跨浏览器规范功能所需的任何 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"
}
}
在此示例中,每个 CLI 命令模块都有一个部分:@dojo/cli-build-app、@dojo/cli-test-intern 和 @dojo/cli-create-widget。配置始终是分层的,并且按命令 => 功能 => 配置的顺序排列。