使用 Visual Studio Code 進行開發

偵錯

首先，安裝下列擴充功能

• Debugger for Firefox

注意：Debugger for Chrome 已被棄用。您可以安全地刪除它，因為 Visual Studio Code 現在有一個捆綁的 JavaScript 偵錯工具，涵蓋相同的功能。

在開始偵錯工作階段之前，請確保 Metabase 已建置並正在執行。選擇選單檢視、命令面板，搜尋並選擇工作：執行建置工作。或者，使用對應的快捷鍵 Ctrl+Shift+B。內建終端機將出現以顯示進度，等待一會兒，直到 webpack 指示已完成 (100%) 捆綁。

若要開始偵錯 Metabase，請切換至偵錯檢視 (快捷鍵：Ctrl+Shift+D)，然後從頂部的下拉式選單中選取兩個啟動組態之一

• 使用 Firefox 偵錯，或
• 使用 Chrome 偵錯

之後，選擇選單執行、開始偵錯 (快捷鍵：F5) 開始偵錯工作階段。

如需更多詳細資訊，請參閱 VS Code 關於偵錯的完整文件。

以 Docker 為基礎的工作流程

這些指示讓您可以在 Windows、Linux 或 macOS 上使用 Visual Studio Code 處理 Metabase 程式碼庫，而無需手動安裝必要的依賴項目。這可透過利用 Docker 容器和 VS Code 的 Remote Containers 擴充功能來實現。

如需更多詳細資訊，請遵循 VS Code 關於在容器內開發的完整指南。

需求

• Visual Studio Code (顯然)
• Docker
• Remote - Containers 擴充功能 (適用於 VS Code)

重要事項：確保 Docker 執行正常，並且可以用於下載映像檔和啟動容器，例如執行

$ docker run hello-world

如果一切順利，您應該會看到以下訊息

Hello from Docker!
This message shows that your installation appears to be working correctly.

步驟

1. 複製 Metabase 儲存庫

2. 啟動 VS Code 並開啟您複製的 Metabase 儲存庫

3. 從檢視選單中，選擇命令面板…，然後尋找Remote-Container：在容器中重新開啟。(VS Code 也可能會彈出「在容器中開啟」彈出視窗來提示您執行此操作)。注意：VS Code 將首次建立容器，可能需要一些時間。後續載入應該會快得多。

4. 使用選單檢視、命令面板，搜尋並選擇工作：執行建置工作 (或者，使用快捷鍵 Ctrl+Shift+B)。

5. 過一會兒 (在所有 JavaScript 和 Clojure 依賴項目完全下載後)，使用您的 Web 瀏覽器開啟 localhost:3000。

如需使用 Docker 執行 Metabase 開發分支的更多資訊，請參閱此處。