Karpathy 4 条规则是写给 AI Coding Agent 的行为准则，源自他 2026 年 1 月对 LLM 编码常见错误的观察，核心是先想再写、最小化改动、外科手术式修改、目标驱动。

1. Think Before Coding — 别假设、别掩饰困惑，主动暴露权衡和歧义
2. Simplicity First — 最小可用代码，不写"以防万一"的抽象和功能
3. Surgical Changes — 外科手术式修改，只动该动的，只清理自己造成的孤儿
4. Goal-Driven Execution — 把模糊指令转成可验证的成功标准，让 Agent 自己循环到完成

一句话：不告诉 Agent 走哪条路，告诉它什么叫"做完了"。LLM 在"循环到满足具体目标"这件事上异常擅长，给强标准比给详细步骤更有效。

Preflight 是 Tailwind CSS 内置的「基础样式重置/规范化」工具，基于 modern-normalize，抹平浏览器默认样式差异，统一基线，让你只用工具类就能一致地控制布局与外观。

核心做了 5 件事：

1. 全局 box-sizing：所有元素默认 border-box，保证 padding/border 不会撑宽元素

2. 清空默认边距：清除 h1~h6、p、ul、blockquote 等默认 margin/padding，避免意外留白

3. 语义化但无外观：标题不再自带大小/加粗，列表去掉项目符号，只保留语义

4. 媒体默认 block：img、svg、video、canvas 默认 display: block，避免底部空白间隙

5. 表单元素统一：修复 Safari 等浏览器的控件样式差异，继承字体

Code Inspector 是一款 IDE 自动跳转插件，让你在浏览器中点击元素就能直接跳转到对应的源码位置。核心原理分为 3 步：

1. 编译期插桩：打包时用 AST 解析，给每个 DOM 元素注入源码位置属性

2. 运行时监听：浏览器端监听快捷键+点击，从 DOM 取出埋点信息

3. 本地服务调度：向本地服务发送请求，调用 IDE 命令打开文件并定位

Linux 中有 2 种链接方式，理解它们的区别是掌握文件系统的基础：

1. 硬链接：同一个文件，多个文件名（共用 inode），删除本体不影响其他链接

2. 软链接（符号链接）：快捷方式，存储路径指向原文件，删本体就失效

写 Agent Skill 最容易踩的 4 个坑，加一份最小可用的模板。

1. 最小目录：一个 SKILL.md，Agent 只加载这一份。
2. 核心定位：description 决定何时调，不是"能做什么"。
3. 坑一：description 写漂亮话 = 装了个寂寞。
4. 坑二：SKILL.md 里塞百科，首次加载被拖垮。
5. 坑三：把 Agent 已经会的事写进去，浪费 token。
6. 坑四：装太多 Skill = 每轮白付 token。
7. 结论：Skill 的价值 = 领域知识 + 不可替代的本地动作。

Skill 不是一段 prompt，而是一份 带触发条件的可复用指令包。把它的内部结构画出来，5 分钟就能看明白。

1. 核心观点：skill = 触发条件 + 指令正文 + 可选资源三层结构，和 prompt 的区别在「可被自动加载」。
2. 第一层：YAML frontmatter 里的 name / description 决定何时触发，决定 agent 是否"看见"它。
3. 第二层：Markdown 正文是 agent 真正读到并执行的内容，等价于一段 system prompt 补丁。
4. 第三层：references/ scripts/ assets/ 是按需调用的工具集，不进 context。

npm/yarn 与 pnpm 依赖解析的 核心区别

1. npm/yarn 采用 hoisting 提升机制，纵容幽灵依赖，是设计缺陷
2. pnpm 基于虚拟存储 + 符号链接，严格禁止传递依赖直接访问，确保依赖树 100% 正确一致
3. 典型问题：npm 下"正常运行"的代码，pnpm 下会报 Webpack 解析错误

解决方案：直接 pnpm add 添加为显式依赖，一行命令解决。

本质是设计理念的选择：pnpm 把正确性放在第一位，而不是开发便利性。

额外优势：磁盘节省 50%+，安装速度快 2-3 倍，全局硬链接共享同版本包。