安装
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 环境。看完提示再执行，不要在不明环境里直接回车。
装好后做一件可逆的核对：让 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 复述将要改的文件，你确认后再继续。