店裡週日休息，網站還寫天天營業？用 OpenCode 改公休與電話按鈕
重點摘要
- OpenCode 2.2.0以當日可用的flint-40b-free實際修改自製早餐店HTML，完成公休文字與電話按鈕兩個要求。
- 修改後營業時間為週一至週六06:00–12:00、週日公休，原來65元與55元兩份套餐文字保留。
- 七項HTML檢查通過，瀏覽器核對電話按鈕可見且點擊連結為指定tel號碼；未實際撥號。
- 本次命令執行器量到33.6秒，包含啟動及檔案差異輸出；頁面未部署，不代表任意網站都能同樣快速完成。
- 結論： 本次自製小頁面的兩個明確修改已完成，改完仍需自行驗看。
- 適合： 有現成靜態頁面、能指出修改文字與應保留內容並自行驗看的人
- 不適合： 期待一句話完成正式網站部署、或不願檢視改動的人
| 實測項目 | 結果 |
|---|---|
| 文字與按鈕修改 | 2個要求完成 |
| HTML核對 | 7/7通過 |
| 套餐保留 | 65元與55元 |
| 電話連結 | tel:0212345678（示範，未撥號） |
| 命令含差異輸出時間 | 33.6秒 |
| 網站上線 | 未部署 |
店裡營業時間改了，網站卻還留著舊資訊。打開檔案，眼前是一整串標籤，連想加個「電話訂餐」都不知道該放哪裡。這次我們做了一張早餐店示範頁，讓 OpenCode 直接修改檔案，再用瀏覽器確認結果。它的用途是用自然語言交代程式修改，不是自動替店家經營網站。
先說這次真的做了什麼
示範頁原本寫「天天營業 06:00–12:00」，另有蛋餅加豆漿 65 元、吐司加紅茶 55 元。我們一次要求改成週日公休、加上電話訂餐按鈕，並保留原來菜單及價格。店名、電話和內容全是自製示範，沒有真實店家或顧客資料。
測試設備為 Mac mini M4 Pro（12 核、64GB），受測軟體是 OpenCode CLI 2.2.0，Node.js 為 22.23.3。當日未登入帳號的模型清單列出 opencode/flint-40b-free，實際執行選的就是這個模型；免費模型名單和供應情況可能改變，請先列出清單，不要照抄不存在的名稱。
安裝與準備檔案
依照官方 README的 npm 安裝方式，本文把版本固定成這次受測版本：
npm install -g @opencode/[email protected]
opencode --version
opencode models
接著進入你要修改的網站資料夾。這次只有一個 index.html，是單純的靜態頁面，不需要資料庫或網站帳號。先留一份原檔，再交代需求；如果你用的是其他檔名，指令與提示都要一起改。
cd /你的網站資料夾
cp index.html index.before.html
OpenCode 會讀這個資料夾中的檔案，並不是把網頁畫面貼進聊天後再自己複製答案回去。不要先拿正式網站唯一一份檔案試手氣；這次先用副本，就是為了能比較改動前後。
把要改與要保留的一起講清楚
以下是本次實際提交的提示。--standalone 使用獨立服務；--format json 留下逐步工具紀錄。--auto 用於這次無人值守的自製示範；一般操作可以拿掉，逐次確認權限。
opencode run --standalone --auto \
--model opencode/flint-40b-free --format json \
'Edit index.html only. This is a synthetic breakfast shop page. Change 天天營業 06:00–12:00 to 週一至週六 06:00–12:00，週日公休. Add a visible button labeled 電話訂餐 with href tel:0212345678. Keep existing menu items, prices, heading, and style intact. Do not use subagents, network tools, packages, or shell commands. Use file read/edit tools only. Write the actual HTML file.' \
> agent-run.jsonl
重點是指定檔案、寫出完整新文字、給定按鈕標籤與連結，並列明菜單價格不能動。只說「幫我改好網站」很難判斷做到什麼；這次的兩個要求則能直接回到頁面逐一核對。
改完別只看 AI 說完成
本次執行器量到約 33.6 秒，包含啟動、模型回應及檔案差異輸出，不能當成所有網站都能在相同時間完成。實際結果如下：
| 核對項目 | 實際結果 |
|---|---|
| 營業時間 | 更新為週一至週六、週日公休 |
| 電話按鈕 | 顯示「電話訂餐」，連結為指定的 tel: 號碼 |
| 兩份套餐 | 65 元與 55 元的文字保留 |
| 檔案核對 | 七項文字、標題與連結檢查全通過 |
我們重新開啟頁面，確認公休文字與按鈕可見，再攔截點擊事件核對電話連結，沒有真的撥電話。讀者可先在資料夾執行下面指令，再用瀏覽器開啟顯示的網址；核對完按 Ctrl+C 結束。
python3 -m http.server 8000
# 瀏覽器開啟 http://127.0.0.1:8000/
如果找不到模型，先重跑 opencode models；如果改錯檔，先確認目前所在資料夾。頁面沒變時，檢查重新整理後讀的是修改版還是備份版，別只憑模型回覆判定成功。
我會怎麼用
這次適合拿來參考的是「現成小頁面的明確修改」：少了一次自己尋找標籤、複製貼上的工作，結果仍由人驗看。它已完成我們的兩個要求，但這不代表網站已經上線。正式主機部署、真實電話撥號、複雜網站與其他模型，本次沒有驗證。
專案：anomalyco/opencode。程式授權為 MIT；查閱的原始碼提交為 35a4a6876df1f0979c1123b236bed234ca5e86d2，與安裝包版本分別記錄，未宣稱兩者完全相同。更多操作見官方 CLI 文件與模型文件。