AI 應用

Bolt.new 怎麼用?從提示詞、token 額度到發佈上線一次看懂

開店之前,要先找店面、拉水電、辦門牌、準備倉庫,這四件事互不相干,卻缺一不可。做網站也是如此,開發環境、資料庫、主機、網域原本各是一件事,得分別處理。Bolt 做的就是把這四樣東西收進同一個瀏覽器分頁,使用者在對話框描述想法,由 AI 把成品蓋出來。

Bolt.new 是 StackBlitz 開發的 AI 建站與應用程式生成工具,可以產出網站、Web 應用與行動 App。因為上手門檻低,常有人以為輸入一句話就能得到可以收款、也能被搜尋到的正式網站。實際上,哪些事 Bolt 會自動處理、哪些事仍得自己決定,直接影響 token 會不會很快用完,以及網站能不能穩定上線。

要判斷它適不適合自己,得先弄清楚它的性質,也就是做出來的東西歸誰、跑在哪裡、能做到哪裡為止。

Bolt.new 是什麼?

英文的 bolt 是個多義詞,可以指螺栓、閃電,也有不少產品用這個名字。以下說的 Bolt,專指 StackBlitz 開發的 Bolt.new,不是同名的其他服務。

Bolt 的說明文件把它定位成「an AI-powered builder for websites, web apps, and mobile apps」,也就是用來建置網站、Web 應用與行動 App 的 AI 工具。操作方式是在對話框輸入想法,按下 Build now,Bolt 就會把想法變成一個可以運作的專案。用 Bolt 與 StackBlitz 產生的程式碼歸使用者所有,說明文件寫明可以用於任何合法用途,包含商業用途。

Bolt 列出的使用對象有五類:產品經理用它從想法做出可以和團隊測試的原型;創業者用它從公司網站一路做到完整產品;行銷人員用它做含 SEO 與主機的活動頁;代理商用它在不增加人手的情況下接更多案子;學生則把課堂作業或個人專案做成真正能跑的應用。這些都是 Bolt 自己的定位說法,實際成果仍要看每個專案的需求。另外,說明文件提到 Bolt 符合 SOC 2 Type II 規範。

Bolt 在瀏覽器內執行,帳號與 StackBlitz 共用

Bolt 是 StackBlitz 的產品,而 StackBlitz 正是 WebContainers 背後的團隊。WebContainers 是第一個讓 Node.js 直接在瀏覽器裡執行的技術,簡單來說,就是把一整套開發環境搬進瀏覽器分頁。Bolt 的 FAQ 也明講它不需要下載安裝,註冊後打開 bolt.new 就能開始建置。

這帶來一個很實際的好處。平常架站前要先在電腦上裝好 Node.js、編輯器和各種套件,設定出錯就得花半天排查,Bolt 把這些前置工作省掉了。使用者面對的只剩對話框、預覽視窗和程式碼檢視。

帳號的部分則和 StackBlitz 連動。說明文件指出,Bolt 與 StackBlitz 共用帳號與專案管理,有些帳號層級的動作,例如重設 Email,要回到 StackBlitz 處理。遇到這類狀況,別因為在 Bolt 的設定頁裡找不到,就以為功能不存在。

Bolt 能生成的網站、Web 應用與行動 App

Bolt 的說明文件把一句提示詞就能做出的成品,歸成三類。第一類是網站,例如 Landing page、個人與企業網站、電商店面。第二類是 Web 應用,像專案管理工具、求職看板、CRM、SaaS 平台與預約系統。第三類是行動 App,包含遊戲、生產力工具、社群 App 與健身規劃,這一類走的是 Expo,要在第一個提示詞就講明是 mobile app。

這三類的差別在於互動程度與使用方式。網站偏內容展示,Web 應用讓使用者輸入資料、有登入與資料庫,行動 App 則是要安裝到手機或平板上的應用。分清楚自己要哪一類,是後面所有提示詞的起點。

此外,Bolt 還有一項做簡報的功能 Bolt Slides,內建版面、講者視圖與註解工具,所有方案都能使用。至於建置時間,Bolt 的快速入門範例是一個含註冊登入與收藏功能的小型應用,因為得先建資料庫,約需 5 分鐘;沒有資料庫功能的應用通常更快。換句話說,它能縮短製作時間,但不是按下去就立刻完成。

第一次使用 Bolt,從首頁輸入框到預覽畫面

Bolt 的快速入門用一個「寵物取名」小應用,示範從零到完成的完整流程。順序很單純,先打開 bolt.new,把提示詞貼進首頁的輸入框,按下 Build now,之後就等 Bolt 建置,最後在預覽視窗裡試用。

Bolt.new 首頁中央的輸入框,輸入想法後按 Build now 就會開始建置專案,下方另有 Figma、GitHub 與團隊模板等起點
在 bolt.new 首頁輸入框寫下想做的東西,按下 Build now 開始建置;第一次按下時才會要求登入或註冊(截圖來源:Bolt 官網首頁)。

流程中途會遇到的畫面和等待,比步驟本身更值得先知道。第一次按下 Build now 時,Bolt 會要求登入或註冊,可選 Google、GitHub 或 Email,說明文件註明不需要信用卡。登入後會先填一份簡短問卷,再開始建置,快速入門範例約等 5 分鐘。

建置完成後,成品直接出現在 Preview 視窗,可以馬上操作。如果提示詞裡提到會員或收藏,Bolt 在第一個提示詞就會判斷需要資料庫,自動建好資料表與登入資料。畫面頂端的資料庫圖示可以打開資料表檢視,專案設定裡也有 User Management 可以看使用者清單。

使用 Bolt 的瀏覽器需求與手機版限制

使用前先看硬性條件,能避免開了才發現不能用。桌面端建議使用 Chrome 或其他 Chromium 系瀏覽器,說明文件列出的有 Edge、Brave、Vivaldi、Opera 等。Safari 也能用,但有幾個差別,一是 Code view 裡的檔案是唯讀的,只能看不能直接改,也不能用終端機;二是預覽不在瀏覽器內執行,而是由雲端託管,每次修改後要等它重新產生預覽,而且這個託管預覽不等於正式網站,要上線仍得發佈。

手機瀏覽器可以用來開專案、和 Bolt 對話、預覽、發佈、邀請協作者,也能還原舊版本,但用不了 Code view、視覺編輯與資料庫,還原前也看不到舊版本的預覽。發佈的公開或私有設定則看方案,Pro 與 Teams 方案在手機上也能選,其他方案從手機發佈的網站一律公開。要改程式碼或管理私有網站的檢視名單,還是得回到桌面端。

另外,廣告攔截、隱私外掛或 VPN 這類瀏覽器擴充,有時會干擾 Bolt 運作。畫面載入不完整或預覽顯示異常時,先停用這些擴充再試一次,通常是最快的排查方式。

從文字描述、設計稿、GitHub 或模板建立專案

專案不一定要從空白提示詞開始。最直接的起點是文字描述,在輸入框寫下想做的東西按 Enter,也可以同時上傳圖片等檔案,當作素材或參考,讓 Bolt 知道想要什麼樣子。

已經有設計稿的人,可以改走匯入。Bolt 透過 Anima 把 Figma 設計轉成應用,匯入單位是單一 frame,而不是整個 Figma 專案,所以要先連結 Figma 帳號,再到 Figma 對 frame 按右鍵,選 Copy/Paste as,再選 Copy link to selection 取得網址。說明文件提醒,設計稿若在 Figma 裡先做好各種螢幕尺寸的版面,之後能省 token;沒做的話,也可以匯入後請 Bolt 處理響應式。Google Stitch 的設計稿同樣可以匯入。

另外兩種起點是既有程式碼與模板。已經放在 GitHub 的專案,可以直接匯入倉庫繼續做,不用重來。Bolt Templates 市集則提供現成專案,按 Use template 會複製成新專案,與原模板脫鉤,模板之後更新也不會影響你的副本。用模板起步免費,之後客製時才照常消耗 token。Teams 方案另外有團隊模板,讓團隊共用設計系統與專案結構。

提示詞越具體,Bolt 第一次建置的結果越貼近需求

Bolt 的說明文件把使用流程拆成幾個階段,先規劃,再下第一個提示詞,之後一步一步增加功能。這個順序的道理很實際,AI 沒辦法替人決定想做什麼,描述得越明確,需要返工的次數就越少,而每一次返工都在消耗 token。

下第一個提示詞前先回答的五個問題

Bolt 建議在下第一個提示詞之前,先回答五件事:

  1. 要做什麼?用一句話講出專案的性質。
  2. 給誰用?使用者是誰,會決定介面與功能的取捨。
  3. 有哪些功能?列出使用者能做的事。
  4. 想要什麼視覺風格?可以用文字描述,也可以上傳圖片當參考。
  5. 使用者如何存取?是網站、Web 應用,還是要安裝的行動 App。

第五題最容易被略過,卻會決定整個專案的結構,所以要一開始就講。Bolt 把格式分成三種:網站偏內容,像部落格和作品集;Web 應用可以互動,使用者能輸入資料;行動 App 則需要安裝到裝置上。

說明文件附了一段完整範例:做一個給重視時間區塊與番茄鐘的人使用的待辦清單 App,功能包括新增、編輯、刪除待辦與排程,風格現代簡潔但多彩,在瀏覽器使用並部署。把五個問題的答案串成這樣一段話,Bolt 拿到的資訊就足夠第一次建置。

Enhance prompt 會用提問補齊細節

如果覺得自己寫不完整,可以交給 Enhance prompt。它不是單純潤飾文字,而是先反過來問問題,再根據回答產出建議的提示詞。操作路徑是對話框左下角的加號,選 Enhance prompt,回答跳出的「Help us enhance your prompt」對話框中的問題,Bolt 就會產生一份建議提示詞,可以再自行編輯。

說明文件拿同一段簡短的待辦清單描述做對照,增強後的提示詞列出核心功能、排程、番茄鐘、技術需求與設計準則,內容完整很多;對照圖裡,增強後做出的首頁也更完整、頁面更多。

這個功能適合只有模糊想法的人。它把「我還沒想清楚」這件事轉成一連串可以回答的問題,比自己面對空白輸入框更容易起步。

一次只改一處的提示原則與檔案鎖定工具

Bolt 的提示詞快速要點可以濃縮成幾條,包括先講清楚架構與使用的工具、框架,功能一個一個加,細節用小而具體的提示詞處理,以及明講哪些要改、哪些不要動。說明文件還特別提醒「Don’t expect the LLM to have common sense」,意思是不要假設 AI 會自己懂得常識,沒寫出來的限制它就不知道。

為了把範圍收窄,Bolt 提供三個工具。在 Code view 的檔案上按右鍵選 Target file,可以限定這次只改某個檔案;選 Lock file 或 Lock all,則把不想被動到的檔案或資料夾鎖起來;選取一段程式碼後按 Ask Bolt,可以針對那一段提問或修改。

Bolt 沒有完成要求的事時,說明文件的建議是拆成小步驟、一次改一處、確認後再進行下一步。FAQ 對「為什麼只做了一部分」的回答也一樣,一次要求太多容易做到一半,改成連續的小提示詞,或先用 Plan Mode 討論建置策略。對話太長時 Bolt 會漏掉前面的內容,這時可以請它先摘要目前的對話,再複製專案開新的對話。

Bolt 的提示詞庫、Knowledge、語音輸入與排隊功能

有幾個輔助功能專門用來省掉重複的工作。Prompt Library 可以存常用提示詞,之後在各個專案裡反覆套用;它也內建一批提示詞,涵蓋 SEO、無障礙、深色模式與錯誤處理等常見需求。開啟方式是對話框左下角的加號,選 Open Prompt Library,或在輸入框打 / 搜尋提示詞名稱。

Knowledge 則是持續生效的背景指示,可以設在帳號、專案或團隊三個層級,用來固定語氣、規則和偏好,不必每次提示詞都重講一遍。

語音輸入(Dictation)支援多種語言,用麥克風圖示就能開始。要留意的是,轉錄本身會消耗 token,就算最後沒送出提示詞也一樣。另外,Bolt 在忙著建置時,還可以把後面的提示詞先排隊,最多 20 個,前一個做完才會處理下一個,排隊中的提示詞可以編輯、調整順序或刪除。

Plan 模式與 Standard、Max 代理的分工

新手最容易燒掉 token 的時刻,就是還沒想清楚就按下建置。Bolt 提供兩個控制手段,一個是先討論、確認後才動手的 Plan 模式,另一個是依任務難度選擇的代理。前者決定要不要改程式碼,後者決定思考得多深。

Plan 模式先討論,確認再建置

Plan 模式是一種只聊天、不改程式碼的對話模式。Bolt 在這個模式下仍然看得到整個專案的程式碼和近期訊息,所以回答會貼近專案實況,也能查詢網路上的最新資料並標出來源。說明文件列出的用途包括除錯協助、工具與函式庫建議、設計與功能建議、理解並串接外部 API,以及產出之後再執行的實作計畫。

討論到滿意時,回應下方會出現快速按鈕,可以一鍵切回 Build 模式,照計畫動手。Plan 模式比 Build 模式省 token,因為它不更動專案,沒有來回交換程式碼的消耗。

有個使用細節,在首頁直接按 Plan,Bolt 會先建好應用的基本結構,再提出計畫供審閱。也就是說,從首頁開始的第一個提示詞也能用 Plan 模式。要做行動 App 的話,同樣得在提示詞裡講明。

Standard 與 Max 代理的適用任務

代理是 Bolt 內部負責思考與動手的引擎,分成 Standard 和 Max 兩種。Standard 定位是日常建置的平衡選擇,速度快、省 token,適合中小型應用、介面調整、一般開發與定義清楚的任務,所有方案都能用。Max 的推理更深入,每一步都想得更多,適合大型應用、有複雜相依關係的功能、重構與沒有明確答案的開放式任務,但只有付費方案才能使用。

選擇代理的重點是配合任務難度。任務簡單卻用 Max,可能白白多耗 token,看不出明顯差別;任務複雜卻用 Standard,則可能要多次提示才做得完。

代理可以在兩個地方切換,一是首頁輸入框底部的下拉選單,二是專案內對話框左下角的代理名稱。Bolt 會記住每個專案各自的選擇,也可以在帳號設定的 General 裡指定新專案的預設代理。

修改 Bolt 專案的四種方式,token 成本各不相同

建好之後,大部分時間都花在反覆調整。同樣是改一個地方,用提示詞、視覺編輯或直接改程式碼,耗掉的 token 落差很大。Bolt 快速入門剛好用同一個應用示範了每種做法的消耗,這些數字是說明文件的範例,實際用量會隨專案大小而變:

修改方式快速入門範例的 token 消耗
第一次建置約 204K
用提示詞把標題改名約 70K(剩餘從 96K 降到 26K)
在 Code view 改同一個名稱不耗 token
還原到先前的版本不耗 token

視覺編輯雖然沒有列在這張表裡,同樣是預覽中免費調整、儲存時才計算 token。

用提示詞修改最彈性,也最耗 token

提示詞可以改任何東西,從版面到功能邏輯都行,缺點是成本最高。Bolt 的 Tokens 說明寫得很直接,大部分用量來自 Bolt 讀取、理解並同步專案檔案,所以專案越大,每一則訊息就越貴。上面範例裡光是把標題改個名稱就用掉約 70K,原因就在這裡。

想縮小範圍,可以先用 Select 工具點選畫面上的元素,再下提示詞,Bolt 就知道要改的是哪一塊。另一個方法是在提示詞裡用 @ 標註特定的檔案或資料夾,讓 Bolt 只關注那個範圍,不必掃整個專案。

視覺編輯在預覽中免費、存檔才計費

視覺編輯適合字句、顏色、字級這類微調,所有方案都能使用。操作是先在對話框開啟 Select 工具,把滑鼠移到預覽畫面的元素上,Bolt 會把它標示出來。文字元素可以雙擊直接修改,也能用工具列調整顏色、字級、對齊、樣式、連結與清單;圖片或影片則可以改替代文字、填滿方式與透明度。

這些修改不會馬上寫進程式碼,而是先集中在對話框上方的批次裡,按 Save changes 後 Bolt 才更新專案程式碼。說明文件明確寫道,在預覽中做視覺編輯是免費的,只有儲存時才會消耗 token,而且批次儲存比逐項修改更省。工具列沒有涵蓋的調整,仍然可以選取元素後用提示詞描述。

Code view 改程式碼不耗 token,但不受版本歷史保護

Code view 適合有一點程式基礎、或只想改文字與標籤的人,可以搜尋文字、直接修改檔案,改完按 Save 即可。這種方式不耗 token,免費版碰到每日 token 上限時,仍然可以在 Code view 修改既有的程式碼。Safari 使用者要留意,那裡的 Code view 是唯讀的。

風險也很明確。快速入門的警告寫道,直接改程式碼很容易改壞,而且版本歷史不會涵蓋這類修改,也就是說,出了狀況不能靠還原版本救回來,得靠提示詞請 Bolt 幫忙修。所以新手較穩的用法,是只改畫面上的文字與標籤,其他邏輯交給提示詞處理。

版本還原不耗 token,也不會退回資料庫內容

Bolt 會自動保存專案的歷史版本,需要時從版本歷史挑一個還原。還原前可以先預覽,確認是想要的那一版;版本也可以改名、加書籤,讓重要的節點好找。還原不會消耗 token,這讓它成為最划算的後悔藥。

資料庫的部分有一點要特別留意。說明文件寫明,還原到較早的專案版本,不會變動現有的 Bolt 資料庫或 Supabase 資料庫,也就是說程式碼退回去了,使用者已經存進去的資料仍然在原處。

除了版本歷史,還有兩條備份路線。近期的修改可以從對話記錄找到還原點,也可以點左上角的專案名稱選 Download 下載專案壓縮檔,之後透過 StackBlitz 帳號還原成新專案。手機版也能從版本清單還原,但看不到舊版本的預覽,想先確認內容再還原,要回桌面端。

修改 Bolt 專案的四種方式對照:提示詞最耗 token,視覺編輯儲存時才計費,Code view 與版本還原都不耗 token
改文字標籤用 Code view、微調樣式用視覺編輯、改壞了用版本還原,只有真的需要 AI 動手時才下提示詞,token 才花在刀口上。

Bolt Cloud 內建的資料庫、會員登入與收款

Bolt 和單純產生前端頁面的工具,最大差別在於 Bolt Cloud。它把主機、網域、資料庫、登入、檔案儲存、伺服器函式與流量分析放在同一個專案裡,使用者不必另外申請帳號或自己串接外部服務。

這也說明了為什麼提示詞一提到「會員登入」,Bolt 就會跟著建立資料庫,因為登入需要有地方存使用者資料。說明文件指出,資料庫的數量沒有上限,也不必自己設定伺服器;Bolt 定價頁的免費方案同樣列有 Unlimited databases。

資料庫與登入在提示詞提到時自動建立

當提示詞需要資料庫,或者使用者明確要求時,Bolt 會自動建立。像「Create user accounts via email sign-up and login」這樣的提示詞,Bolt 若發現專案還沒有資料庫,會先建立再做登入。建立後,資料庫設定裡可以管理資料表、驗證、檔案儲存、日誌、機密、安全檢查、伺服器函式與使用者管理。

簡單的專案其實不一定需要資料庫。說明文件提供了避免自動建立的寫法,在提示詞裡直接講明「Don’t use a database, I want to use local storage for this app」,Bolt 就會改用瀏覽器本機儲存。這適合只在單一裝置使用、不需要多人共用資料的小工具。

Supabase 限付費方案,建立專案時就該選定

預設使用的是 Bolt 資料庫,Supabase 則是 Pro 與 Teams 方案才有的選項,適合需要 Supabase 進階功能的專案。使用方式有三種:建立專案時直接選 Supabase 當預設資料庫、把現有的 Bolt 資料庫「認領」到 Supabase,或是連接自己原有的 Supabase 專案。

說明文件提醒,確定要用 Supabase 的話,最好在建立專案時就選好,事後從 Bolt 資料庫切換需要額外步驟。連接既有 Supabase 專案時也要小心,若目前專案已有 Bolt 資料,連接可能取代現有設定而造成資料遺失,所以應先認領 Bolt 資料庫保存資料。

此外,一個 Bolt 帳號只能連接一個 Supabase 組織,之後可以斷開,但無法換成另一個組織。

Stripe 收款需要先有資料庫與登入

Stripe 整合支援一次性付款與訂閱,會同步 Stripe 後台的商品,處理 webhook,也有測試模式。聽起來很方便,但前提不能略過,專案必須已有 Bolt 資料庫或 Supabase,並且已經設定好使用者登入,另外還需要使用者自己的 Stripe 帳號。

開發階段使用 Stripe 的測試金鑰,格式以 sk_test_ 開頭,確認流程沒問題再上線。付款在伺服器端的 edge functions 處理,敏感的付款資料不會經過前端程式碼,因此這項整合需要 edge functions,不支援 Firebase。

也就是說,要收款得先備好資料庫、登入和 Stripe 帳號這三樣基礎,收款功能才有地方落腳。

Bolt 後端限定 JavaScript,不支援 PHP 與 Python

習慣 WordPress 與傳統架站方式的人,最需要先知道這條邊界。說明文件的原話是「Bolt only supports JavaScript-based backends, so languages such as PHP or Python aren’t compatible」,也就是後端限定 JavaScript 系,PHP 與 Python 都不相容。Bolt 支援 Node.js 後端與瀏覽器端的 JavaScript 框架。

WordPress 以 PHP 為基礎,所以 Bolt 產出的是 JavaScript 專案,不是 WordPress 佈景主題或外掛,也不能把現有的 WordPress 網站直接丟進去修改。想用 Bolt 做的網站,需要接受它是另一套技術架構。

登入方面,Bolt 做出來的網站可以串接 Google SSO,讓訪客用 Google 帳號登入,說明文件的 Connect tools 列表也提到 Expo、Stripe、GitHub 與 MCP。

從 bolt.host 網址到自訂網域的發佈流程

做好的專案要讓別人看到,得發佈成網站。這一段有個常被忽略的細節,發佈要用 Publish 或 Update 按鈕,而不是用提示詞請 Bolt 發佈,後者會消耗 token,按鈕則不會。

發佈後的修改要按 Update 才會上線

第一次發佈的步驟很簡單,先按右上角的 Publish,在選單裡再按一次 Publish,等約 1 分鐘,點對話窗裡的連結就能看到網站。Bolt 會自動產生一個隨機名稱的 bolt.host 子網域,免費方案也有,之後可以點網址旁的鉛筆圖示改名。

發佈之後再改專案,不會自動同步到線上。要讓修改生效,得從 Publish 選單按 Update。要下線的話可以 Unpublish,但如果網站連了自訂網域,必須先解除連結。說明文件也特別提醒,發佈與更新一律用這兩個按鈕處理,不要透過提示詞代勞。

Bolt 也提供連接 Netlify 發佈的選擇,兩種主機之間可以互相切換,但切換前得先下線專案;用了自訂網域的話,要先解除網域連結再下線,而且自訂網域不會自動跟著搬過去,換到 Netlify 後要在 Netlify 後台重新加入。

私有發佈、自訂網域與 DNS 的設定條件

兩項能力只有付費方案才有。第一是私有發佈,管理者可以邀請個別使用者,或加入信任網域,讓使用相同 Email 網域的人自動取得檢視權限。第二是自訂網域,可以連接已有的網域,也可以直接在 Bolt 內購買。要注意的是,連了自訂網域的網站只能公開發佈;在 Bolt 買的網域,購買後 60 天內處於鎖定狀態,期間可以移到自己的 Name.com 帳號,滿 60 天後才能轉到其他註冊商。降級回免費方案後,已購買的網域仍然可以繼續管理。

DNS 設定是不少人第一次接觸就覺得複雜的地方,要點有三個:

  1. www 要用 CNAME,值指向 site-dns.bolt.host。
  2. 根網域要用 ALIAS、ANAME 或 Flattened CNAME,值同樣是 site-dns.bolt.host。說明文件強調要找的是 ALIAS 這類,不是 AAAA。
  3. 外部的子網域需要多加一筆 TXT 紀錄做擁有權驗證,驗證通常需要 3 到 5 分鐘。

DNS 生效通常在數小時內完成,最長可能到 24 小時。專案必須已經發佈,才能設定自訂網域。免費方案發佈的網站會帶有 Made in Bolt 標記,升級付費方案並重新發佈後才會移除。

Bolt 發佈流程:按 Publish 取得 bolt.host 網址,修改後按 Update 上線,付費方案再以 CNAME 或 ALIAS 指向 site-dns.bolt.host 接上自訂網域
發佈與更新都用 Publish、Update 按鈕處理,不耗 token;接自訂網域時,www 用 CNAME、根網域用 ALIAS 這類紀錄,值都是 site-dns.bolt.host。

Bolt 付費方案內建的安全稽核與六類檢查項目

AI 產生的程式碼,在上線前最好再檢查一遍。Bolt 內建的專案安全稽核,是付費方案的功能,從 Publish 選單選 Run security audit 即可。稽核與修正都不耗 token,每天最多 30 次,以 UTC 午夜重置。

稽核涵蓋六類項目:誰能看與改資料,公開部分有沒有洩漏私人資訊,登入與工作階段是否正確,有沒有可被濫用的邏輯(例如改價格、略過必要步驟、重複領取單次商品),訪客輸入是否經過檢查(例如檔案上傳),以及金鑰與安全設定。Bolt 能自己修的會直接修,需要使用者處理的項目則列在對話裡。

Bolt 安全稽核檢查資料存取、公開內容、登入與工作階段、可被濫用的邏輯、訪客輸入、金鑰與安全設定六類項目
安全稽核是付費方案功能,稽核與修正都不耗 token,每天最多 30 次;它能降低風險,但不代表從此安全無虞(資料來源:Bolt)。

所有方案都能在資料庫設定的 Security 分頁做資料庫安全檢查。稽核修正後如果不滿意,可以用版本歷史退回。

Bolt 網站的搜尋引擎收錄條件與 JavaScript 轉譯

搜尋引擎收錄的第一個前提,是網站必須公開。Bolt 說明文件指出,公開網站任何人都能看,搜尋引擎也能找到並列入結果;私有網站則不行。

至於 Bolt 產出的頁面能否被順利讀取,取決於專案實際採用的框架與設定,這要在自己的專案裡驗證。Google 的 JavaScript SEO 說明文件提供了判斷依據:Google 處理 JavaScript 網頁分成抓取、轉譯、索引三個階段,並且建議採用 server-side 或預先轉譯(pre-rendering),因為這樣對使用者與爬蟲都更快,而且不是所有爬蟲都能執行 JavaScript。

同一份文件還有幾項檢查重點:每個頁面需要各自獨立的 title 與 meta description(可以由 JavaScript 設定);連結要使用有 href 屬性的 <a> 標籤,並用 History API 處理單頁應用的路由,避免用 # 片段;採用用戶端轉譯與路由的單頁應用,遇到不存在的頁面時要避免 soft 404,做法是用 JavaScript 把訪客導向一個伺服器會回傳 404 狀態碼的網址,或在錯誤頁用 JavaScript 加上 noindex 標記。

Bolt 的定價頁在 Pro 方案列有 SEO boosting,說明文件的分析功能則顯示頁面瀏覽、訪客與流量來源,但分析功能僅限發佈在 Bolt 主機上的付費方案專案,目前也不會區分爬蟲與真人,數字可能偏高。因此較穩的做法,是在提示詞裡先講明使用的框架,以及每頁都要有獨立的 title 與描述,上線後再用 Google Search Console 的網址檢查工具,驗證 Google 實際看到的頁面內容。

Bolt 的協作、行動 App 與 MCP 連接器

協作、行動 App 與 MCP 連接器這三項,重點在各自的定位與限制,尤其是「誰的 token 被用掉」,以及「哪些服務要自己準備帳號」。

協作:Bolt 把 Project 和 Site 分開,Project 是建置用的工作空間,Site 是別人能造訪的網站,所以 Share 與 Publish 是兩件事,前者決定誰能進專案,後者決定誰能看網站。專案可以邀請別人以檢視者(Viewer)、編輯者(Editor)或共同擁有者(Co-owner)的身分加入,其中共同擁有者只開放給同一個團隊的成員;使用個人方案,或邀請團隊以外的人時,就只能選檢視者與編輯者。要多人同時操作,專案必須是公開的;Bolt 同一時間只處理一個提示詞,其他的會排隊。協作者在專案裡下提示詞時,扣的是下提示詞那個人的 token,不是專案擁有者的。預覽畫面上也可以留言討論。

行動 App:靠 Expo 完成,Bolt 說明文件強調要在第一個提示詞就講明是 mobile app,因為網頁專案之後不容易轉成行動 App。開發中可以用 Expo Go 掃 QR code,在手機上測試,完成後可發佈到 TestFlight、App Store 與 Google Play。上架這一步不在瀏覽器裡完成,要把程式碼下載到裝有 Node.js 與 Git 的電腦,再用 Expo 的命令列工具 EAS CLI 送出;另外需要 Expo 帳號,上架 iOS 與 Android 則各需要付費的開發者帳號,這兩項費用來自 Apple 與 Google 的開發者計畫,不是 Bolt 額外收費。

MCP 連接器:可以讓 Bolt 存取外部服務的即時資料,內建的包括 Notion、Linear、GitHub 等,驗證方式有 API key 與 MCP OAuth 兩種。說明文件提醒,同時開太多連接器、每個又有很多工具,可能拖慢 Bolt、降低輸出品質,也會增加 token 消耗,所以需要時才開。

Free、Pro、Teams 方案與 token 額度

方案與價格會隨時調整,以下數字取自 Bolt 定價頁與說明文件的現況,實際以官方定價頁為準,費用以美元計價。比起記住數字,更重要的是看懂 token 怎麼被花掉,因為這決定了每個方案的額度夠不夠用。

四種方案的價格與功能界線

Bolt 目前有 Free、Pro、Teams 與 Enterprise 四種方案。前三種的主要差異如下:

項目FreeProTeams
月費$0$25/月(月繳)$30/成員/月(月繳)
每月 token1M10M 起,另有更高層級依訂閱層級配給每位付費成員,不共用
每日 token 上限300K無無
主機額度10 GB 頻寬、333,333 次請求30 GB 頻寬、100 萬次請求,可設花費上限按量加購同 Pro(所有付費方案都含 Pro 主機)
自訂網域不可可可
Made in Bolt 標記有無無
Max 代理不可可可
Supabase不可可可
私有發佈與安全稽核不可可可

Teams 在 Pro 的基礎上加了集中計費、團隊存取管理、組織共用、私有 NPM 登錄支援與設計系統知識。Enterprise 則是客製報價,列出的項目有 SSO、稽核日誌、專職客戶經理與 24 小時優先支援。

Bolt 定價頁列出 Free、Pro、Teams 與 Enterprise 四種方案,Free 每月 1M token、Pro 月繳每月 25 美元
Bolt 官方定價頁的方案比較,月繳時 Pro 為每月 25 美元、Teams 為每位成員每月 30 美元;價格會隨時調整,以官方定價頁為準(截圖來源:Bolt 官網/定價頁)。

主機額度有一個容易踩到的界線,免費方案有硬性流量上限,超過後網站會停止服務,直到下個月重置,也無法加購。說明文件估計,免費方案大約支撐每月 1 萬到 1.5 萬次造訪,Pro 則可到 10 萬次以上,這是 Bolt 的估計值,實際會隨頁面大小而不同。另外,Bolt 的訂閱不可退款。

token 的消耗來源、重置與結轉規則

token 是 AI 讀寫文字的基本單位,Bolt 在讀取提示詞與專案檔案、思考、回應與建置時都會消耗。前面提過,Tokens 說明頁指出大部分用量來自讀取、理解與同步專案檔案,所以專案越大,每則訊息就越貴。

重置規則依方案不同。免費方案在每個月 1 日重置,每日 300K 的上限則每天重置,沒用完也不會累積到隔天。付費方案在訂閱續訂日重置,沒用完的 token 會結轉,有效期為兩個月,並採先進先出,舊的先用;免費方案則沒有結轉。

取消與降級的處理方式不同。取消付費方案的話,所有已配發的 token(含結轉)會在當期帳單週期結束時失效,若在結轉 token 到期前重新訂閱,還能拿回尚未過期的部分;從較高層級的付費方案降到較低層級,原本沒用完的 token 則可以繼續用到到期為止。

訂閱最高層級的個人月繳 Pro 方案,或任何年繳 Pro 方案,可以加購 Reload tokens,這部分的 token 不會過期。想隨時看用量,可以到 Settings 的 General,打開 Display token usage in chat,餘額就會顯示在對話框上方。

Bolt token 重置與結轉規則:免費方案每月 1 日重置且不結轉,付費方案在續訂日重置,未用完的 token 可結轉兩個月
token 大多花在讀取與同步專案檔案,專案越大每則訊息越貴;付費方案沒用完的 token 可結轉兩個月,取消訂閱則在當期結束時失效(資料來源:Bolt)。

精簡專案檔案與清除脈絡的省 token 做法

除了前面提過用 Plan 模式、視覺編輯與版本歷史取代提示詞,縮小專案與管理脈絡也能省下不少 token。

脈絡指的是專案檔案與對話裡送給 Bolt 的所有內容,越小越省 token,效能也越好。在確定 Bolt 不需要記得短期內容時,可以在輸入框打 /clear,再點選單裡的 Clear context,這會清掉對話記錄,但保留程式碼與檔案。專案本身則可以清掉沒用到的檔案,或把過長的檔案拆小;說明文件建議請 Bolt 列出超過約 700 行的檔案,再逐一重構。在 Code view 的終端機執行 npx knip --production --fix --allow-remove-files,也能清除未使用的檔案,而且不耗 token。

遇到錯誤時,每按一次 Attempt fix 都會消耗 token,連按幾次沒有改善,就該改成手動查原因,或切到 Plan 模式發問。陷入錯誤迴圈時,可以請 Bolt 加強錯誤處理與日誌,再依日誌修復。功能一次加一個,每加一個就測試,也能避開代價高昂的返工。

適合 Bolt.new 的專案類型與需要先評估的情境

哪些情境值得考慮、哪些先評估再決定,可以從 Bolt 的定位與說明文件看出輪廓。這些是 Bolt 自己列出的使用情境,不代表一定適合,是否合用仍要看個別需求。

第一類是活動頁、Landing page 與個人、企業形象頁。Bolt 的說法是行銷人員可以做出含 SEO 與主機的活動頁,這屬於 Bolt 的自我宣稱,實際成效需要自己驗證。第二類是產品原型與 MVP,從文字描述或 Figma 設計稿快速做出可以點擊的成品,讓團隊測試想法。第三類是小型 Web 應用與內部工具,含登入、資料庫與簡單的收款。

需要先評估的情境有四種:後端必須用 PHP 或 Python;要直接整合既有的 WordPress 站;預期有大量流量卻使用免費方案,超過額度網站會停擺;需要完整稽核與權限控管,卻沒有使用 Teams 或 Enterprise。這四種情境有的牽涉方案額度,有的牽涉技術架構,動手前先確認,比較不會做到一半才發現走不通。

適合用 Bolt 的是活動頁、產品原型與小型 Web 應用;後端要用 PHP、要整合既有 WordPress 站或大流量用免費方案則要先評估
Bolt 擅長快速做出活動頁、原型與小型應用,但後端只支援 JavaScript、免費方案有硬性流量上限,這些界線要在動手前先確認。

長期使用 Bolt 前要先處理的限制與風險

上線之後、準備長期使用時,還有幾項實際的限制要先處理,每一項在 Bolt 說明文件裡都有明文,不是泛泛的「AI 工具有風險」。

程式碼與資料的備份和遷移路線

專案不會被鎖在 Bolt 裡,說明文件提供了幾條退路。GitHub 整合可以自動備份專案,保留完整的修改歷史,Bolt 每次修改都會同步,並在不破壞專案的前提下建立 commit,也支援分支。程式碼放進 GitHub 之後,可以改用 Bolt 主機、Netlify 或其他服務發佈。使用前需要個人 GitHub 帳號,只有專案擁有者能連接與管理,Bolt 目前也不支援在應用內合併分支,得回 GitHub 處理。

另外,專案可以從專案名稱選單的 Download 取得壓縮檔;Pro 或 Teams 方案還可以把 Bolt 資料庫認領到 Supabase。已購買的網域在降為免費方案後,仍然能繼續管理。

不過要留意,Bolt 目前沒有公開的 API、CLI 或 SDK,無法從外部用程式控制它。需要自動化流程的團隊,要先把這個限制算進去。

安全稽核降低風險,但不保證安全

前面介紹過安全稽核,放進長期維運的視角,它的角色是降低風險,而不是保證安全。Bolt 說明文件寫道,它能自己修好大部分問題,但有時需要使用者自行調整,例如更新所串接的付款或寄信服務設定。

所以稽核完成不代表從此無事。每次大幅修改功能、串了新服務或改了資料結構,建議再跑一次稽核;稽核完成後按鈕會變成 Security audit up to date,一旦專案有改動,就可以再次執行。

Bolt 預設開啟的模型訓練設定

放進 Bolt 的內容如果包含客戶資料或未公開的點子,這項設定值得先看。Bolt 帳號設定的 General 裡有一個 Model training 開關,控制 Bolt 能不能用你的專案與對話來訓練 AI 模型。

Bolt 的說明文件寫明,預設為開啟,例外是歐盟、英國與瑞士的帳號,這些地區預設關閉。這項設定涵蓋 2026 年 10 月 7 日起在 Bolt 建立的內容;更早建立的內容,只要在這天之後被送進 Bolt 的 AI 功能處理(例如在既有專案裡下提示詞),也同樣適用。關閉不影響訂閱方案,隨時可以改回來。既然預設值因地區而異,實際狀態請到帳號設定頁確認,不要憑印象判斷。

Bolt 把開發環境、資料庫、主機與網域收進同一個分頁,省下的是搭建的功夫,省不下的是決定要做什麼,以及做到什麼程度才算能放心上線。上線前跑過安全稽核、確認備份路線,再核對模型訓練的設定,Bolt 才會從「能做出東西」變成「能長期用下去」的工具。

常見問答

本區問答由 AI 依文章內容自動整理,僅供快速參考,正式內容仍以全文為準。

Bolt.new 是哪家公司開發的 AI 工具?

Bolt.new 是 StackBlitz 開發的 AI 建站與應用程式生成工具,在對話框描述想法後,就能產出網站、Web 應用與行動 App。Bolt 在瀏覽器內執行,不需要下載安裝,帳號也與 StackBlitz 共用。

使用 Bolt.new 要用什麼瀏覽器?

Bolt 桌面端建議用 Chrome 或其他 Chromium 系瀏覽器。Safari 也能用,但 Code view 唯讀、預覽改由雲端託管;手機瀏覽器用不了 Code view、視覺編輯與資料庫,發佈時只有 Pro 與 Teams 方案能選私有,其他方案一律公開。

Bolt 的 Plan 模式適合在什麼時候用?

Bolt 的 Plan 模式只聊天、不改程式碼,適合先討論除錯方向、功能設計或實作計畫,確認後再一鍵切回 Build 模式動手。因為不更動專案,Plan 模式比 Build 模式省 token。

Bolt 的 Standard 和 Max 代理怎麼選擇?

Bolt 的代理要依任務難度選。Standard 速度快、省 token,適合中小型應用與定義清楚的任務,所有方案都能用;Max 推理更深入,適合大型應用、重構與開放式任務,但只有付費方案能使用。

修改 Bolt 專案時怎麼做最省 token?

修改 Bolt 專案時,在 Code view 直接改程式碼與還原版本都不耗 token,視覺編輯在預覽中免費、儲存時才計算。用提示詞修改最彈性也最耗 token,因為大部分用量來自讀取與同步專案檔案。

Bolt 還原舊版本會連資料庫一起退回嗎?

Bolt 還原到較早的專案版本,不會變動現有的 Bolt 資料庫或 Supabase 資料庫,程式碼退回去了,已經存進去的資料仍然在原處。要留意的是,在 Code view 直接改的程式碼不受版本歷史保護。

Bolt 能做 WordPress 或 PHP 網站嗎?

Bolt 的後端只支援 JavaScript 系,PHP 與 Python 都不相容。WordPress 以 PHP 為基礎,Bolt 產出的是 JavaScript 專案而非佈景主題或外掛,也無法直接修改既有的 WordPress 網站。

Bolt 免費方案每月有多少 token?

Bolt 免費方案每月有 1M token,每日上限 300K,每月 1 日重置,沒用完的也不會結轉。付費方案在續訂日重置,沒用完的 token 可以結轉兩個月。免費方案也不能使用自訂網域、Max 代理與 Supabase。

Bolt 網站連接自訂網域要怎麼設定 DNS?

Bolt 的自訂網域限付費方案,專案也必須已經發佈。DNS 設定上,www 用 CNAME,根網域用 ALIAS、ANAME 這類紀錄,值都指向 site-dns.bolt.host,生效通常在數小時內,最長可能到 24 小時。

Bolt 預設會拿專案內容訓練 AI 模型嗎?

Bolt 帳號設定 General 裡的 Model training 開關預設為開啟,例外是歐盟、英國與瑞士的帳號,這些地區預設關閉。放進客戶資料或未公開的點子之前,建議先到帳號設定頁確認實際狀態,關閉不影響訂閱方案。

資料來源
  1. Bolt Plans & pricing — Bolt
  2. Bolt 說明文件:Intro to Bolt — Bolt
  3. Bolt 說明文件:Supported browsers and technologies — Bolt
  4. Bolt 說明文件:Bolt QuickStart guide — Bolt
  5. Bolt 說明文件:Tokens — Bolt
  6. Bolt 說明文件:Bolt Cloud hosting plans — Bolt
  7. Bolt 說明文件:Check your project's security — Bolt
  8. Bolt 說明文件:Account settings — Bolt
  9. Bolt 說明文件:Collaborate with others — Bolt
  10. Bolt 說明文件:Publish your project to a live website — Bolt
  11. Bolt 說明文件:Purchase a domain through Bolt — Bolt
  12. Bolt 說明文件:Make visual edits — Bolt
  13. Bolt 說明文件:Chat tools and shortcuts — Bolt
  14. Bolt 說明文件:Manage project context — Bolt
  15. Understand JavaScript SEO Basics — Google