【文章內容使用 Gemini 1.5 Pro 自動翻譯產生】
宣布 DartPad 支援套件
今天,我們很高興地宣布,DartPad 現在支援套件!DartPad 是一個開源的、基於 Web 的程式碼遊樂場,可以直接在您的 Web 瀏覽器中運行 Dart 和 Flutter 應用程式。它允許您快速運行 Dart 程式碼以測試想法或編寫技術概念,而無需在您的本機系統上安裝 Flutter SDK 或任何工具。
自 DartPad 推出以來,最受歡迎的請求之一 就是加入支援直接在 DartPad 的編輯器中匯入套件,例如 Google Fonts 或 Firebase 驗證。在推出的第一階段,您可以從一組熱門套件中匯入。
為了幫助您入門,我們建立了幾個新的範例,您可以使用 DartPad 的範例選單找到這些範例。
Google Fonts 範例
透過在程式碼編輯器頂部加入匯入語句來開始使用套件。例如,要使用 Google Fonts 套件,請加入以下內容:
1 | import 'package:google_fonts/google_fonts.dart'; |
DartPad 會為您處理 pubspec 細節,因此您只需要匯入語句即可。您可以使用建議的自動完成來變更字體,然後重新運行應用程式,就像在 IDE 中一樣。
套件支援如何運作
以下是 DartPad 中套件支援如何運作的快速概覽。DartPad 伺服器會取得支援的套件集,並使用 flutter pub get 來取得每個套件的最新相容版本。然後,伺服器會在分析和編譯您的 DartPad 指令碼期間使用這些套件版本。
此版本還支援最受歡迎的 Firebase 套件,因此您無需離開 DartPad 即可存取一系列後端服務。所有必要的 Firebase JavaScript SDK 都會在運行已編譯的應用程式之前載入到輸出面板中。
以下是一個使用 Firebase 的 簡單聊天應用程式:
這個多使用者聊天應用程式僅使用在瀏覽器中運行(和編寫)的用戶端 Dart 程式碼實作,並使用 Firestore 資料庫在使用者之間共用訊息。雖然將資料庫直接開放給使用者似乎很危險,但實際上它很安全,因為它只允許使用一組特定文字的聊天訊息。閱讀 程式碼 中的註釋以進一步了解其運作方式。
要擴展聊天應用程式,您可以實作登入以識別誰說了什麼,方法是加入 Firebase 驗證。我們計畫加入更多 Firebase 功能,以擴展您在 DartPad 中使用 Firebase 可以執行的操作。
支援的套件
此第一階段的推出支援一組定義的熱門套件。要查看哪些套件可用(以及哪些版本),請點擊螢幕右下角的資訊圖示。
試試看!
立即在 dartpad.dev 上試用 DartPad 套件支援,並與我們的團隊分享任何 回饋。我們將會繼續擴展支援的套件列表。如果您對想要加入的套件有任何偏好,請 搜尋包含所需套件名稱的議題,並給它一個 👍「豎起大拇指」的反應。如果沒有您想要的套件的議題,請 建立一個議題,並將套件名稱放在標題中。
我們希望 DartPad 上的套件支援能夠讓您建立和展示您的 Flutter 設計、想法、小插圖等等。我們迫不及待地想看看您接下來會建立什麼!