wasm-pack build

wasm-pack build 命令會建立 JavaScript 互通性和將套件發佈到 npm 所需的檔案。這涉及將您的程式碼編譯為 wasm 並產生一個 pkg 資料夾。這個 pkg 資料夾將包含 wasm 二進位檔、JS 包裝器檔案、您的 README 和 package.json 檔案。

預設情況下，pkg 目錄會自動被 .gitignore 忽略，因為它包含不應簽入版本控制的建置成品。0

路徑

wasm-pack build 命令可以指定一個可選的路徑參數，例如：

wasm-pack build examples/js-hello-world

此路徑應指向包含 Cargo.toml 檔案的目錄。如果未指定路徑，則 build 命令將在當前目錄中執行。

輸出目錄

預設情況下，wasm-pack 將為其建置輸出產生一個名為 pkg 的目錄。如果您想自訂它，可以使用 --out-dir 旗標。

wasm-pack build --out-dir out

上述命令會將您的建置成品放在名為 out 的目錄中，而不是預設的 pkg。

產生的檔案名稱

旗標 --out-name 設定輸出檔案名稱的前綴。如果未提供，則改用套件名稱。

用法範例，假設我們的 crate 名稱為 dom

wasm-pack build
# will produce files
# dom.d.ts  dom.js  dom_bg.d.ts  dom_bg.wasm  package.json  README.md

wasm-pack build --out-name index
# will produce files
# index.d.ts  index.js  index_bg.d.ts  index_bg.wasm  package.json  README.md

設定檔

build 命令接受一個可選的設定檔參數：--dev、--profiling 或 --release 之一。如果未提供，則使用 --release。

這控制是否啟用偵錯斷言、是否產生偵錯資訊，以及啟用哪些（如果有）最佳化。

設定檔偵錯斷言偵錯資訊最佳化注意事項
--dev 是是否適用於開發和偵錯。
--profiling 否是是適用於分析和調查效能問題時。
--release 否否是適用於發佈到生產環境。

--dev 設定檔將使用 cargo 的 預設非發行設定檔 來建置輸出套件。以這種方式建置速度更快，但對輸出的最佳化較少，並啟用偵錯斷言和其他執行階段正確性檢查。--profiling 和 --release 設定檔使用 cargo 的發行設定檔，但前者也啟用偵錯資訊，這有助於在分析器中調查效能問題。

設定檔旗標的確切含義可能會隨著平台的成熟而發展。

目標

build 命令接受 --target 參數。這將自訂發出的 JS 以及 WebAssembly 檔案的實例化和加載方式。有關此處各種策略的更多文件，請參閱有關使用編譯輸出的文件。

wasm-pack build --target nodejs
選項用法說明
未指定 或 bundler 打包器 輸出適合與 Webpack 等打包器互通的 JS。您將 import JS，並且 module 鍵在 package.json 中指定。預設情況下，sideEffects: false。
nodejs Node.js 輸出使用 CommonJS 模組的 JS，用於 require 語句。package.json 中的 main 鍵。
web 瀏覽器原生 輸出可以作為 ES 模組在瀏覽器中原生導入的 JS，但必須手動實例化和加載 WebAssembly。
no-modules 瀏覽器原生 與 web 相同，但 JS 包含在頁面上並修改全域狀態，並且不支援與 web 一樣多的 wasm-bindgen 功能
deno Deno 輸出可以作為 ES 模組在 deno 中原生導入的 JS。

範圍

build 命令還接受一個可選的 --scope 參數。這將限制您的套件名稱的範圍，如果您的套件名稱可能與公共登錄檔中的名稱衝突，這將很有用。例如

wasm-pack build examples/js-hello-world --scope test

此命令將為名為 @test/js-hello-world 的套件建立一個 package.json 檔案。有關範圍的更多信息，您可以參考此處的 npm 文件。

模式

build 命令接受一個可選的 --mode 參數。

wasm-pack build examples/js-hello-world --mode no-install
選項說明
no-install wasm-pack build 隱式建立 wasm 繫結，而無需安裝 wasm-bindgen。
normal 使用已安裝的 wasm-bindgen 執行 no-install 的所有操作。

額外選項

build 命令可以將額外選項直接傳遞給 cargo build，即使 wasm-pack 不支援它們。要使用它們，只需在命令的最末尾添加額外參數，就像您對 cargo build 所做的一樣。例如，要使用 cargo 的離線功能建置上一個範例

wasm-pack build examples/js-hello-world --mode no-install -- --offline

0 如果您需要在 pkg 目錄和您的 NPM 套件中包含其他資產，我們打算很快為您的用例提供解決方案。 ↩