wokwi elements

沃奎元素

用於 Arduino 和各種電子零件的 Web 組件。

查看組件目錄。

注意：這些元素僅提供所代表硬體的呈現和顯示。他們不提供硬體的功能仿真程式碼。這取決於您希望使用它們的應用程式（模擬器），因此由您來創建。

使用 Wokwi 元素

您可以使用npm安裝該軟體包，然後將其匯入到您的程式碼中：

 import '@wokwi/elements' ;

或者，您可以從 unpkg 的 CDN 載入 Wokwi Elements 套件：

 < script src =" https://unpkg.com/@wokwi/[email protected]/dist/wokwi-elements.bundle.js " > </ script >

將 0.48.3 替換為最新版本號。您可以在發布頁面中找到所有版本的清單。

當地發展

若要準備本機開發，請複製此儲存庫，然後安裝相依性：

 npm install

然後開始講故事：

 npm run storybook

這將在 http://localhost:6006 開啟本機開發伺服器，您可以在其中與元素互動並即時查看更改，類似於 https://elements.wokwi.com。

建立一個新元素

創建新元素的最簡單方法是運行生成器：

 npm run new-element --name demo

這將產生一個名為demo的新元素。它還將創建一個故事書文件，因此您將能夠在故事書中看到新元素（請參閱上面的“本地開發”部分）。

注意：更新程式碼中的文件字串不會反映在 Storybook 的「文件」標籤中，除非您重新啟動 Storybook，或手動執行以下命令並刷新頁面：

 npm run analyze-components

查看貢獻指南以了解更多詳細資訊。

了解如何建立元素

影片教學

薄膜鍵盤元素即時編碼教學逐步介紹了創建元素背後的完整過程：研究、繪圖和編寫程式碼/故事。

部落格文章

• 使用 SVG 和 <lit-element> 重新建立 Arduino 按鈕
• 將 Arduino OLED 顯示器變成 Web 元件

執照

Wokwi Elements 在 MIT 許可下發布。