[譯] Hello, wasm-pack!

Yiniau發表於2018-05-03

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有cargocrates.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.ioGitHub上找到 wasm-pack

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

? What it does today

[譯] Hello, wasm-pack!

現在,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層面的依賴關係。

我們仍然需要解決很多問題,並且要做許多簡單的工程工作。在幾個星期內,這個主題會有一個完整的帖子,所以請留意!

[譯] Hello, wasm-pack!

在Rust中增加Node.js工具鏈

這個專案最大且最雄心勃勃的目標是在Rust中重寫所需的npm loginnpm packnpm publish步驟,以便對於那些目前不使用Node.js的人來說,對Node.js開發環境的所需依賴在其工作流程中變得可選。正如我們之前所說的,我們希望確保WebAssembly包開發者和使用者都可以繼續使用他們熟悉的工作流程。目前,JavaScript開發人員的確如此 - 他們不需要擁有Rust開發環境或Rust的任何知識即可開始使用已使用wasm-pack釋出的使用Rust生成的WebAssembly模組。

與npm和打包器協作

我們一直與npm CLI團隊成員Kat MarchanRebecca Turner以及webpackParcel工作人員進行交流 - 我們很高興與他們繼續合作,以便開發人員輕鬆釋出和使用WebAssembly程式碼!

? Start using it today!

wasm-pack目前是通過Cargo釋出的命令列工具。要安裝它,請安裝Rust開發環境,然後執行:

cargo install wasm-pack
複製程式碼

如果您不確定從哪裡開始,我們為您提供了一個教程!本教程由Michael Gattozzi和Rust-wasm工作小組帶領您:

  • 寫一個小的Rust庫
  • 將其編譯為WebAssembly,打包並使用wasm-pack進行釋出
  • 捆綁webpack製作一個小型網站

[譯] Hello, wasm-pack!

?‍♀️貢獻

所有優秀的開發人員工具的關鍵是該工具的開發人員與在日常工作流程中使用該工具的開發人員之間的短反饋週期。

為了讓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的發展。