dojo dragon main logo

介绍

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 目录中。

服务和监视

可以在 devdist 模式下运行时使用 --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。配置始终是分层的,并且按命令 => 功能 => 配置的顺序排列。