在 Firebase Studio 中設定 Gemini 在 Firebase 中後,您可以立即開始使用它來:
請注意,內嵌程式碼完成和程式碼集索引功能預設為開啟狀態。瞭解如何調整設定。
在 Firebase 中與 Gemini 對話
Firebase Studio 可透過 AI 輔助即時通訊,簡化開發工作流程。
開始使用即時通訊
在 Firebase Studio 中開啟工作區。
按一下工作區底部的「火花」圖示 Gemini。
開始與 Gemini 進行即時通訊。
(選用) 按一下
「附加」,然後選取下列其中一個選項,向 Gemini 傳送多模式提示:
- 繪圖:使用繪圖工具設計所需設計,然後輸入提示並點選「傳送」。
- 圖片:上傳圖片、新增提示,然後按一下「傳送」。
- 檔案:從工作區中選取要用於背景資訊的檔案,新增提示,然後按一下「傳送」。
(選用) 新增自己的 Gemini API 鍵,並選擇其他 Gemini 模型。如要進一步瞭解,請參閱「自訂金鑰:在聊天中使用其他 Gemini 模型」。
(選用) 調整 Firebase 中的 Gemini 設定並新增 AI 規則檔案,自訂 Gemini 的協助方式。瞭解詳情。
啟用即時通訊功能後,您可以提出 Gemini 問題並取得程式碼建議。Gemini 甚至可以直接在工作區中更新專案設定檔和程式碼,並為您執行終端機指令。Gemini 可能會詢問是否可以執行下列任一操作:
- 修改檔案: Gemini 可以新增功能、修正錯誤或重構程式碼。當 Gemini 提出檔案變更建議時,您會看到兩個選項:
- 更新檔案:直接更新檔案,採用 Gemini 建議的變更。
- 查看變更:在另一個視窗中開啟提議的變更內容,然後再套用。
執行終端機指令: Gemini 可以執行安裝依附元件或啟動開發伺服器等指令。系統可能會自行提出這些指令,您也可以要求 Gemini 執行這些指令。Gemini 提出指令後,系統會顯示「Run Terminal Command」按鈕。按一下即可在 Firebase Studio 的終端機中執行指令。Gemini 會執行指令,並在即時通訊視窗中為您解讀結果,協助您決定後續步驟。
注意:如果是長時間執行的指令 (例如使用
npm run dev
執行伺服器),畫面上會顯示「Detach」按鈕。按一下「Detach」,讓指令繼續在終端機中執行,同時恢復即時通訊功能。
透過即時通訊完成複雜工作
Firebase 中的 Gemini 可協助您完成複雜的開發工作,例如:
- 為程式碼撰寫文件:當您要求 Gemini「Write my docs.」時,Gemini 會自動以適當格式為程式碼產生文件。
- 編寫測試案例: Gemini 可自動更新並產生單元測試。如果您要求 Gemini 執行「write my tests」,Gemini 會尋找現有的單元測試檔案,並將缺少的測試新增至該檔案。如果找不到現有的單元測試檔案,它會建立單元測試,供您查看、重複執行及接受,甚至可以要求 Gemini 執行測試!
- 管理依附元件:您可以要求 Gemini 偵測程式碼中缺少的依附元件,並直接透過即時通訊介面解決這些問題。
- 重構程式碼:您可以要求 Gemini 代表您重構程式碼,例如在多個檔案中擷取函式或重新命名變數。Gemini 會產生建議變更清單,在您查看並套用變更後,可以要求 Gemini 更新並執行單元測試,以驗證重構作業,並確保測試持續通過。
- 產生及執行 Docker 工作流程:如果您已在工作區中啟用 Docker,只要請 Gemini 建立 Dockerfile (例如「為我的應用程式建立 Dockerfile」),即可快速將應用程式容器化。Gemini 產生 Dockerfile 後,即可為您建構及執行容器。
- 執行單元和整合測試:您可以要求 Gemini 執行特定的測試套件 (例如「Run my unit tests」或「Run integration tests」),以便啟動測試執行作業。Gemini 會為專案執行適當的指令 (例如
npm test
或特定測試執行器指令),並在即時通訊介面中顯示測試結果。
在 Chat 中使用斜線指令
您可以使用斜線指令 (前面加上正斜線 /
的捷徑),引導 Firebase 對話中 Gemini 提供的輸出內容。請在 Gemini 對話提示的開頭輸入 /
,然後從可用斜線指令清單中選取所需動作。
如需完整的斜線指令清單,請在聊天室中輸入 /
。
舉例來說,/generate
後面接著簡短說明所需內容,就是用來產生程式碼片段的提示捷徑。
以下是執行 /generate css for a black background
的傳回值範例:
body {
background-color: black;
}
/* This CSS code sets the background color of the <body> element to black. This will make the background of the entire web page black. */
管理即時通訊記錄
您可以透過啟動不同的討論串,在 Gemini Firebase 聊天中區隔不同主題。接著,您可以根據主題參照先前的討論串。
如要發起新的即時通訊,請按照下列步驟操作:
按一下即時通訊標頭列中的「發起即時通訊」。
輸入提示。
如要切換至其他即時通訊會話串,請按照下列步驟操作:
按一下聊天標頭列中的「最近的聊天」。
選取要存取的聊天串流。
繼續該即時通訊串,或使用 Gemini 查看先前的對話。
如要刪除聊天串:
在聊天室標題列中,從「近期聊天」選取要刪除的聊天串。
按一下聊天室標頭列中的「刪除聊天室」。確認要從即時通訊記錄中刪除即時通訊會話串。
在即時通訊中查看程式碼引用
為協助您驗證程式碼建議,Firebase Studio 會提供原始來源和相關授權資訊。只要按一下即時通訊標頭列中的「授權記錄」圖示,即可在即時通訊視窗中查看完整的程式碼引用記錄。
如要進一步瞭解 Google 程式碼引用資料,請參閱「生成程式碼輔助功能」。
在 Firebase 中取得 Gemini 的即時協助
Firebase Studio 可透過 Gemini 提供的 AI 輔助程式碼建議,提升工作效率。
請注意,程式碼完成功能預設為開啟。瞭解如何調整設定。
在 Firebase 中取得 Gemini 提供的程式碼建議
Gemini 會產生完整的內嵌程式碼區塊。如要使用 Gemini 內嵌程式碼輔助功能,請按照下列步驟操作:
在 Firebase Studio 中開啟工作區。
前往您需要協助的檔案或程式碼行,然後按下
Ctrl+I
(在 macOS 上為Cmd+I
)。輸入所需內容的說明,Gemini 就會產生建議。您也可以使用動作做為捷徑,引導建議。舉例來說,輸入
/fixError
可協助修正內嵌程式碼中的錯誤。選擇執行下列任一選項:
- 如要保留生成的程式碼,請按一下「接受」。
- 如要將建議內容貼到其他位置或移至新檔案,請在「Discard」按鈕的下拉式選單中選取對應的選項。
- 如要產生新的建議內容,請按一下「重新產生」。
- 如要徹底移除建議,請按一下「捨棄」。
(選用) 調整 Firebase 中的 Gemini 設定並新增 AI 規則檔案,自訂 Gemini 的協助方式。瞭解詳情。
在 Firebase 指令中檢視 Gemini 內嵌內容
如要查看特定程式碼的 Gemini 指令內嵌,請選取要取得協助的程式碼,然後按一下滑鼠右鍵。
從選單中選取「火花」Gemini,然後選取要執行的動作。
使用 Gemini 建議的程式碼完成功能
為了協助您編寫程式碼,Firebase Studio 提供 AI 程式碼補全功能,只要您開始輸入內容,系統就會預測並在任何開啟的檔案中自動填入程式碼。
請注意,程式碼完成功能預設為開啟。
如要開啟或關閉程式碼完成功能,請使用下列任一方法調整程式碼完成設定:
如果您使用
settings.json
檔案,請將"IDX.aI.enableInlineCompletion"
設為true
或false
。如要更新 Firebase Studio 工作區中的設定,請按照下列步驟操作:
按一下
「管理」 (位於工作區左下方),然後選擇「設定」,或按下
Ctrl+,
鍵 (Mac 為Cmd+,
)。如果您在 Prototyper view, click
Switch to Code to open Code view. 中使用 App Prototyping agent
選取「Workspace」分頁,然後搜尋「Firebase Studio」>「AI」>「啟用內嵌完成功能」設定。
如要關閉程式碼完成功能,請取消選取「在您輸入時啟用內嵌程式碼完成功能」選項。