這是歷史版本頁面 — 看 Brackets 最新版本
Brackets 編輯器停更了,寫網頁還能用它嗎
寫網頁時,最煩的就是改一行 CSS 就要切到瀏覽器按重新整理,來回幾次就暈了。尤其前端切版階段,微調間距、顏色、字體大小,每調一次就看一次,整個流程斷斷續續,專注力全被切換動作打散。你需要的是一個能讓你在寫程式的同時,馬上看到結果的工具,而不是改完還要手動刷新、等畫面重載。
傳統做法是開著編輯器和瀏覽器兩個視窗,改完存檔、切過去、按 F5。聽起來沒什麼,但一天下來重複幾十次,累積的時間和注意力損失很可觀。這類工具的切入點,是把「編輯」和「預覽」併在一起,讓你在同一個畫面裡邊改邊看,甚至直接點選網頁元素就能跳到對應的 CSS 規則。這樣的工作方式,是為了縮短「修改→確認」的回饋迴圈,而不是幫你把程式寫得更好。
01Brackets 是做什麼用的?
它是一套免費的開源程式碼編輯器,主要給寫網頁的人用,支援 HTML、CSS、JavaScript。核心功能是 Live Preview,也就是你在編輯器裡改程式碼,瀏覽器會同步更新畫面,不用手動重新整理。另外還有 Quick Edit,可以直接在 HTML 檔裡點選元素,旁邊跳出對應的 CSS 規則來修改,不用切換檔案。
02Live Preview 即時預覽是怎麼運作的?
開啟 Live Preview 後,編輯器會在你存檔的瞬間把變動同步到瀏覽器,你不用自己按重新整理。它支援 Chrome 和 Firefox,其他瀏覽器可能會有相容性問題。使用時要把 HTML 檔案放在專案資料夾裡,單獨開一個檔案有時會無法啟動預覽。這個功能對切版、調 CSS 特別實用,改完馬上看到結果。
03Quick Edit 快速編輯是什麼意思?
它是 Brackets 的一個特色功能。在 HTML 檔案裡,把游標放在某個元素或 class 名稱上,按快捷鍵,畫面會直接跳出一個小視窗,顯示對應的 CSS 規則,你可以在裡面直接修改,不用離開目前的檔案。改完關掉視窗就回到原本的 HTML。這對前端切版時頻繁調整樣式很方便,省去在 HTML 和 CSS 之間反覆切換的麻煩。
04它支援哪些程式語言?
官方說明指出,它主要聚焦在網頁開發語言,也就是 HTML、CSS、JavaScript。其他語言可以透過安裝擴充功能來補足,但內建支援就這幾種。如果你主要寫 PHP、Python 或其他後端語言,它並不是設計來做這件事的,雖然還是能開檔案來編輯,但不會有語法提示或除錯這類的輔助功能。
05擴充功能要怎麼安裝?
編輯器內建擴充功能管理員,打開後可以直接搜尋、安裝、管理擴充套件。可以找到語法檢查、版本控制、程式碼片段管理之類的擴充功能。安裝過程不用另外下載檔案,在管理員介面點一下就會裝好。主題樣式也可以從這裡安裝,改編輯器外觀。擴充功能的數量跟 VS Code 比起來少很多,但常見需求大致上找得到。
06這套軟體適合什麼樣的人?
適合主要寫 HTML、CSS、JavaScript 的前端開發者或設計師,尤其是需要頻繁調整樣式、想即時看到結果的人。它的 Live Preview 和 Quick Edit 對切版工作流幫助很大,而且介面乾淨、輕量,開機速度快,不會像大型 IDE 那樣吃記憶體。如果你只是偶爾改個網頁、不想學太複雜的工具,它也算好上手。
07初學者拿它來學寫網頁適合嗎?
可以。它的介面簡單,沒有太多複雜設定,安裝過程也很快,對剛開始學 HTML 和 CSS 的人來說,負擔比較小。Live Preview 讓初學者改程式碼馬上看到畫面變化,比較有成就感,也比較容易理解每一行程式碼的效果。不過要注意,它已經停止開發,官方建議改用 VS Code,所以如果你打算長期投入,一開始就學 VS Code 可能更省事。
08跟 VS Code 比起來,現在還有人會選 Brackets 嗎?
會,但理由多半是習慣或特定功能。Live Preview 和 Quick Edit 是 Brackets 的強項,對純前端切版的人來說,這兩個功能確實好用。VS Code 功能更全面、擴充生態更龐大,但相對也比較複雜。如果你已經習慣 Brackets 的工作方式,繼續用沒有問題;如果還在選工具,VS Code 是官方建議的遷移目標,社群和更新都更活躍。
09它已經停止維護了,繼續用會不會有風險?
dobe 在 2021 年 9 月結束對 Brackets 的支援,之後官方不再推出新版本。這代表不會有新的功能、安全性更新或相容性修補。如果你只是拿來寫個人專案,風險不大;但如果是工作用途,或需要跟其他工具搭配,就要考慮長期維護的問題。官方建議可以到 GitHub fork 專案自行維護,或者改用 VS Code。
10介面只有英文,對中文使用者有影響嗎?
介面是英文的,沒有官方中文語系。對看得懂英文的人來說,選單和設定不算難懂,因為選項不多、用詞也簡單。但如果你完全不習慣英文介面,操作上會多一層障礙。可以到擴充功能管理員找找看有沒有社群做的中文化套件,但這不是官方提供的,安裝後的效果和更新狀況需要自行確認。
11我主要是寫後端程式,適合用 Brackets 嗎?
不適合。它主要服務前端開發,對 HTML、CSS、JavaScript 的支援最完整,後端語言沒有內建的語法提示或除錯功能。雖然可以安裝擴充功能來補強,但整體設計不是往那個方向走。如果你主要寫 PHP、Python、Java 這類語言,應該找專門的 IDE 或支援更廣泛的編輯器,像是 VS Code 或 Sublime Text,會順手得多。
12跟 Atom 比起來,哪個比較值得用?
兩者都是免費開源的程式碼編輯器,但 Atom 的使用者評分人數是 277 人,比 Brackets 的 189 人多,社群的活躍程度有差。Atom 的擴充套件數量也比較多,而且 GitHub 在 2022 年也停止維護 Atom 了,所以兩套都是停更狀態。如果你在意社群規模和擴充生態,Atom 可能稍微好一點;但如果你特別需要 Live Preview 這種即時預覽功能,Brackets 的實作方式更直接。
下載與官方連結
Brackets.Release.1.14.1.msi · 76.7 MB · 連結指向軟體原廠
版本紀錄
- 2025-12-12 Brackets 2.2.1 85.4 MB
- 2020-04-06 Brackets 1.14.2 77.1 MB
- 2019-12-05 Brackets 1.14.1 76.7 MB
再看 5 筆
- 2019-05-02 TrackOFF 5.0.0.17682 141 MB
- 2019-05-02 Brackets 1.14 76.6 MB
- 2018-06-18 Brackets 1.13 72.7 MB
- 2018-01-30 Brackets 1.12 69.1 MB
- 2017-09-25 Brackets 1.11
這一版改了什麼
What's new in this version:
- The 1.14.1 release has a security update to fix remote exploitation by DNS rebinding vulnerability noticed with remote debugging enabled by default on application launch
To address the security issue, the CEF debugger is disabled by default on application launch. Users who would want to enable debugging should launch Brackets from command line/terminal with the following command:
- Brackets.exe --remote-debugging-port=
- A toast notification will be shown in Brackets UI with the message “Remote debugging enabled on localhost:12345” for valid port number and remote debugging will be enabled. If port is not in the range between 1024 – 65534, the remote debugger is disabled on launch and a toast notification will be shown with the message “Cannot enable remote debugging on port <>. Port numbers should be between 1024 and 65534”