[譯] Hello, wasm-pack!

---

title: [譯] Hello, wasm-pack!

date: 2018-4-28 7:29:00

categories: 翻譯

tags: WebAssembly

source: 原文地址

auther: Ashley Williams

---

[譯] Hello, wasm-pack!

---

正如Lin Clark在她的關於Rust和WebAssembly的文章中強調的那樣：WebAssembly的目標不是取代JavaScript，而是成爲一個很是棒的JavaScript工具。爲了簡化跨越JavaScript和WebAssembly之間的語言界限，已經涌現了許多許多使人驚歎的成果，你能夠閱讀Alex Crichton在wasm-bindgen上發佈的全部內容。本文重點介紹不一樣類型的 JavaScript/Rust 集成：軟件包生態系統(package ecosystem)和開發人員工做流程(developer workflows)。

Rust和JavaScript都有充滿活力的包管理生態系統。Rust有cargo和crates.io。JavaScript有 幾個 CLI 工具，包括與npm註冊表鏈接的npm CLI。爲了使WebAssembly得到成功，咱們須要這兩個系統良好地協同工做，特別是：

• Rust開發人員應該可以生成用於JavaScript的WebAssembly包，而不須要Node.js開發環境
• JavaScript開發人員應該可以使用WebAssembly而不須要Rust開發環境

✨📦 Enter: wasm-pack.

wasm-pack 是用於組裝和包裝以WebAssembly爲目標的Rust包裝箱的工具。這些軟件包能夠發佈到npm Registry並與其餘軟件包一塊兒使用。這意味着你能夠將它們與JS和其餘軟件包並行使用，而且能夠在許多類型的應用程序中使用，例如Node.js服務器端應用程序，Webpack捆綁的客戶端應用程序或任何其餘類型的應用程序使用npm依賴關係。你能夠在crates.io和GitHub上找到 wasm-pack 。

這個工具的開發剛剛開始，咱們很高興可以從涉及Rust和JavaScript的開發人員中得到更多的幫助。JavaScript和Rust生態系統都專一於開發者體驗。咱們首先知道，生產高效的生態系統的關鍵是使自動執行枯燥任務並擺脫開發人員方式的好工具。首先咱們知道，一個高效生產的生態系統的關鍵是自動執行枯燥任務並使開發人員擺脫無聊方式的好工具。在本文中，我將討論咱們的進度，咱們的目標，如何開始使用工具，以及如何參與塑造將來。

💁 What it does today

如今，wasm-pack 引導你完成四個基本步驟，準備將你的Rust代碼做爲WebAssembly包發佈到npm註冊表中：

1. Compile to WebAssembly

wasm-pack 將使用 rustup 添加相應的WebAssembly編譯目標，並以發佈模式編譯Rust到WebAssembly。

• 若是須要，添加wasm32-unknown-unknown編譯目標
• 將你的項目編譯到發佈版本

2. Run wasm-bindgen

wasm-pack 包裝了 wasm-bindgen 工具的CLI部分併爲你運行它！這能夠將WebAssembly模塊封裝在JS包裝中，這樣人們能夠更輕鬆地與模塊進行交互。wasm-bindgen 同時支持ES6模塊和CommonJS，你可使用 wasm-pack 生成任意類型的包！

3. Generate package.json

wasm-pack 會讀取你的 Cargo.toml 並生成將你的軟件包發佈到npm註冊表所需的package.json文件。它會：

• 複製你的項目名稱和說明
• 連接到你的Rust項目的存儲庫
• 列出文件密鑰中生成的JavaScript文件。這能夠確保有且只有這些文件包含在npm包中。若是你打算在瀏覽器中使用此軟件包或包含此軟件包的軟件包，這對於確保良好的性能尤其重要！

4. Documentation

wasm-pack 會將你的Rust項目的README.md複製到它生成的npm包中。咱們有不少關於如何進一步擴展以支持Rust生態系統的文檔功能rustdoc的更多想法 - 更多內容請參見下一節！

�� 將來計劃

與rustdoc集成

crates.io團隊對開發人員進行了調查，並瞭解到開發人員在使用crate時的狀況時最但願得到的是優秀的文檔。貢獻者Yoshua Wuyts介紹了經過將rust-pack與Rust API文檔工具rustdoc集成來生成更多README.md內容的絕妙想法。Rust-wasm團隊致力於使Rust成爲編寫WebAssembly的一流方式。提供Rust生成的WebAssembly軟件包的文檔，這些軟件包易於編寫，易於發現，與咱們的目標完美匹配。詳細瞭解團隊在這個iusse上的想法並加入討論！

管理和優化你的Rust和JS依賴關係圖

下一個關於wasm-pack的大型開發工做將着重於在編譯的WebAssembly中使用自定義段來聲明對本地Javascript文件或其餘npm包的依賴關係。

這個功能的初步工做已經落在wasm-bindgen中，因此下一步將把它整合到wasm-pack中。開始的整合不會太棘手 - 但咱們很高興擁有必須簡化和優化Rust依賴關係樹的探索機會，這些依賴關係樹在幾個層次上包含npm依賴關係！這項工做與Webpack這樣的捆綁軟件提供的優化相似，可是Rust層面的依賴關係。

咱們仍然須要解決不少問題，而且要作許多簡單的工程工做。在幾個星期內，這個主題會有一個完整的帖子，因此請留意！

在Rust中增長Node.js工具鏈

這個項目最大且最雄心勃勃的目標是在Rust中重寫所需的npm login，npm pack和npm publish步驟，以便對於那些目前不使用Node.js的人來講，對Node.js開發環境的所需依賴在其工做流程中變得可選。正如咱們以前所說的，咱們但願確保WebAssembly包開發者和用戶均可以繼續使用他們熟悉的工做流程。目前，JavaScript開發人員的確如此 - 他們不須要擁有Rust開發環境或Rust的任何知識便可開始使用已使用wasm-pack發佈的使用Rust生成的WebAssembly模塊。

與npm和打包器協做

咱們一直與npm CLI團隊成員Kat Marchan和Rebecca Turner以及webpack和Parcel工做人員進行交流 - 咱們很高興與他們繼續合做，以便開發人員輕鬆發佈和使用WebAssembly代碼！

🛠 Start using it today!

wasm-pack目前是經過Cargo發佈的命令行工具。要安裝它，請安裝Rust開發環境，而後運行：

cargo install wasm-pack
複製代碼

若是您不肯定從哪裏開始，咱們爲您提供了一個教程！本教程由Michael Gattozzi和Rust-wasm工做小組帶領您：

• 寫一個小的Rust庫
• 將其編譯爲WebAssembly，打包並使用wasm-pack進行發佈
• 捆綁webpack製做一個小型網站

👯‍♀️貢獻

全部優秀的開發人員工具的關鍵是該工具的開發人員與在平常工做流程中使用該工具的開發人員之間的短反饋週期。

爲了讓wasm-pack更完美，也爲咱們全部的WebAssembly開發人員工具，咱們須要全部技能水平和背景的開發人員參與其中！

看看咱們的貢獻者指南和問題跟蹤器（咱們按期將事情標記爲「優先的好問題」，並提供指導和指導！） - 咱們很高興與您合做！

關於 Ashley Williams

Ashley Williams是Integer32的一名工程師，負責Mozilla的Rust編程語言。她是Rust Core團隊的成員，領導Rust社區團隊，並幫助維護Rust的軟件包註冊表crates.io。以前，她曾在Javascript的包管理員npm擔任工程師，目前是Node.js基金會董事會的我的會員。做爲一名有長期教育經歷的老師，Ashley將大部分精力都集中在開源項目的教育計劃上，2016年建立了NodeTogether，目前正在領導RustBridge計劃。她曾表明教師向TC39會議提出見解來影響JavaScript的發展，並熱衷於經過她在WebAssembly上的工做來推進web的發展。