天天看點

Dojo Build 簡介基本用法Dojo 配置

翻譯自:https://github.com/dojo/framework/blob/master/docs/en/building/introduction.md

Dojo 提供了一套強大的指令行工具,讓建構現代應用程式更加簡單。

可以自動建立包(Bundle),可以使用 PWA 在本地緩存檔案,可以在建構階段渲染初始的 HTML 和 CSS,也可以使用 Dojo 的 CLI 工具和 <code>.dojorc</code> 配置檔案按條件忽略一些代碼。或者脫離(eject) Dojo 的建構工具,直接使用底層的建構工具以做到完全掌控。

功能

描述

Dojo CLI

子產品化的指令行工具,用于快速啟動新的應用程式、建立部件和運作測試等。

開發伺服器

開發時使用的本地 web 伺服器,用于監聽檔案系統,當檢測到變化時會自動重新建構。也支援 HTTPS 和設定代理。

包(bundle)

通過減少使用者需要下載下傳的内容和優化使用者實際需要的應用程式互動時間(Time-to-Interactive)以提高使用者體驗。可以根據路由自動建立包,或者在配置檔案中明确定義包。

按條件納入代碼

通過 <code>.dojorc</code> 配置檔案可以靜态方式關閉或打開使用 dojo/has 定義的功能。由于這些配置而無法通路到的代碼分支會被自動忽略掉。這就很容易為特定目标(如 IE11 或 mobile)提供特定功能,而不會影響包的大小。

PWA 支援

漸進式 Web 應用程式通過緩存内容甚至脫機工作,建立更快、更可靠的使用者體驗。通過配置檔案或者在代碼中定義,dojo 很容易建立一個 service work,并将其建構為應用程式的一部分。

建構時渲染

在建構時渲染路由以生成初始的 HTML 和 CSS。在建構時渲染,Dojo 可以節省出初始渲染的成本,建立出一個響應性更高的應用程式,且不會引入額外的複雜性。

Dojo 提供了一組 CLI 指令,輔助建立和建構應用程式。本指南假設已全局安裝 <code>@dojo/cli</code>,且在項目中安裝了 @dojo/cli-build-app 和 @dojo/cli-test-intern。如果項目是使用 @dojo/cli-create-app 初始化的,那麼這些依賴應該已經存在。

Dojo 的 CLI 工具支援多種建構目标或 <code>mode</code>。在 <code>dojo create app</code> 為 <code>package.json</code> 生成的幾個腳本(scripts)中可看到所有模式。

運作以下指令,建立一個為生産環境優化過的建構。

此次建構使用 <code>dist</code> 模式建立應用程式包,并将結果輸出到 <code>output/dist</code> 目錄中。

當在 <code>dev</code> 或 <code>dist</code> 模式下運作時,可以使用 <code>--serve</code> 标記啟動一個 web 伺服器。應用程式預設運作在 9999 端口上。可以使用 <code>--port</code> 标記修改端口。使用 <code>--watch</code> 标記,Dojo 的建構工具也可以監聽應用程式的變化并自動重新建構。

生成的 <code>package.json</code> 檔案中包含 <code>dev</code> 腳本,它使用這些标記運作應用程式的建構版本,并監聽到磁盤上的檔案發生變化後會自動重新建構。

應用程式也會提供 source map。這樣調試器就可以将建構的 JavaScript 代碼映射回位于 <code>src/</code> 檔案夾下原本的 TypeScript 代碼上。

Dojo 使用 Intern 運作單元和功能測試。

T運作 <code>tests/unit</code> 中單元測試的最快方式,是使用建立 Dojo 應用程式時建立的 NPM 腳本。

指令行

Dojo 是一個持續演變的架構。預設情況下,釋出的 dojo 版本會支援最新浏覽器的最近兩個版本。Dojo 要跨浏覽器實作标準功能,其所需的 polyfill 都是通過 <code>@dojo/framework/shim</code> 按需提供的。要支援 IE11,需要打開 <code>--legacy</code> 标記。

可在 <code>.dojorc</code> 中添加其它配置選項。這些選項通常通過指令行擴充可用的設定,并支援更進階的功能,如國際化、代碼拆分、PWA 清單和忽略代碼等。

<code>.dojorc</code> 檔案中包含一個 JSON 對象,可以為能在 dojo 指令行工具上運作的任何指令配置資訊。在配置對象中為每個指令配置設定一個節點,可在其中存儲配置資訊。

本示例中,@dojo/cli-build-app、@dojo/cli-test-intern 和 @dojo/cli-create-widget 三個 CLI 指令子產品各對應一個節點。配置 總是 分層的,按照 command =&gt; feature =&gt; configuration 的順序排列。

繼續閱讀