安裝
npx modern-web-guidance@latest install適合誰
如果你發現編碼 Agent 一遇到彈層、動畫、互動就堆出大量過時 JavaScript，而你其實想用當下 Web 平台已經提供的能力，這組 Skill 更合適。它把 Web 平台經驗、最佳實務和瀏覽器相容性資料嵌進編碼 Agent，用來把方案從舊模式撥向現代平台，而不是再寫一份通用前端教材。
官方解釋過原因：編碼 Agent 常預設舊模式，因為訓練資料裡有大量遺留程式，結果常為已經有原生、高效能平台方案的任務產生臃腫指令稿。你若正在做對話框、頂層動畫、相容性核對，並且接受用 npx 安裝一組 Skill，收益更直接。只想瀏覽文件、不打算改 Agent 行為的人，可以先看命令列檢索，不一定先跑安裝嚮導。
3 分鐘完成第一次嘗試
官方安裝入口只有這一條：
npx modern-web-guidance@latest install
它會啟動互動式嚮導，把 Modern Web Guidance 裝進你的編碼 Agent。這會改本機 Agent 的 Skill 設定，不是唯讀查詢。執行前先確認：本機有 npx，你願意在嚮導裡完成選擇，並且這是你要寫入的那個 Agent 環境。看完提示再執行，不要在不明環境裡直接按 Enter。
裝好後做一件可逆的核對：讓 Agent 檢查「如何為對話框遮罩做動畫」，並要求它優先看現代平台能力，而不是先寫一大段指令稿。成功訊號是：回答會往平台方案和相容性上靠，而不是預設堆出遺留寫法。若 Agent 仍只給舊模式，先停在核對，不要讓它改倉庫檔。
若你還沒準備寫入 Agent，也可以先用同一套 CLI 做唯讀檢索（見下一節）。那一步不代替安裝，只用來確認命令可用。
使用案例
案例一：按任務檢索相關指南。你已經有一句具體需求，例如給對話框遮罩做動畫，但還不知道對應指南叫什麼。在終端執行：
npx modern-web-guidance@latest search "animate a dialog modal backdrop"
官方把它標成 Search for relevant guides。頁面沒有寫回傳條數、排序和是否需要先安裝。所以你能確認的是：這句命令會按關鍵詞檢索指南。看到和對話框、遮罩、動畫相關的條目即可；它沒有授權你把檢索結果理解成可直接貼上的最終補丁。
案例二：用已知 ID 取出一篇指南。當你已經看到 animate-to-from-top-layer 這類識別，執行：
npx modern-web-guidance@latest retrieve "animate-to-from-top-layer"
官方把它標成 Retrieve a guide by ID。它沒有解釋 ID 的完整清單，也沒有寫 retrieve 是否會改專案檔。因此第一次只把輸出當作指南正文來讀；要落到程式裡，再交給已安裝 Skill 的編碼 Agent 做對照，並明確禁止它在你點頭前改檔。
使用邊界
這是預覽版本。官方寫明正在持續增加內容，並歡迎到
https://github.com/GoogleChrome/modern-web-guidance-src
提交貢獻或回饋。頁面沒有保證指南涵蓋全部 Web 平台，也沒有寫預覽期命令是否穩定。檢索不到題目時，只說明目前內容還沒有這條，不要自行補一篇「等效最佳實務」。
安裝路徑就是上面的互動嚮導，檢索和取出是另外兩條命令。不要把 search / retrieve 理解成第二種安裝器，也不要推斷它綁定了某一家 Agent 產品。官方只說面向 coding agents，沒有給出用戶端名單。
第一次優先做檢索或讓 Agent 做唯讀對照。嚮導會寫入 Skill，retrieve 也未聲明是否純展示。任何會改倉庫或設定的步驟，都要先讓 Agent 複述將要改的檔，你確認後再繼續。