直接粘贴html代码会破坏团队格式规范，因缩进、引号、换行等细节丢失导致无意义diff；应通过prettier+统一配置+编辑器自动格式化+git hook+ci检查实现不可绕过的自动化统一。
为什么直接粘贴 HTML 代码段会破坏团队格式规范
把一段 HTML 复制进 index.html 或发到群里，看似快，实则埋雷：缩进用空格还是 Tab、属性是否换行、引号用单还是双、class 属性顺序是否一致——这些细节在纯文本粘贴中全部丢失。Git 提交时会因格式差异产生大量无意义 diff，掩盖真实逻辑变更。
用 Prettier + .prettierrc 确保每次粘贴后自动对齐团队规范
关键不是“别乱改”，而是让编辑器替你改。只要团队共用同一份 .prettierrc，任何人粘贴原始 HTML 片段后，保存即格式化为统一风格。
-
npm install --save-dev prettier安装到项目本地，避免全局版本不一致 - 在项目根目录建
.prettierrc，内容示例：{ "tabWidth": 2, "useTabs": false, "singleQuote": true, "htmlWhitespaceSensitivity": "ignore" } - VS Code 中打开设置，搜
editor.formatOnSave并启用；再设默认格式化工具为Prettier - 特别注意
htmlWhitespaceSensitivity：设为"ignore"可避免 Prettier 错误折叠内联元素间的空白（如<span>A</span> <span>B</span>被压成一行）
分享代码段时必须附带 .editorconfig 和 .prettierrc 链接
光给 HTML 片段没用，协作者不知道你用的是 2 空格还是 4 空格、是否允许自闭合标签。真正可复用的“代码段”，是带配置的最小可运行单元。
- 用
codesandbox或codepen创建新项目，把 HTML 片段放进去，同时上传.prettierrc和.editorconfig - 在共享链接旁明确标注：“此链接含格式配置，复制代码前请先确认本地已启用 Prettier 保存自动格式化”
- 拒绝接收未声明配置的代码段——这不是较真，是防止下次合并时出现 200 行全是缩进变更的 commit
CI/CD 中加一道 Prettier 检查，堵住“我以为格式没问题”的侥幸
本地开了自动格式化，不代表所有人永远开着。有人关了插件、有人用别的编辑器、有人直接改 dist 文件……唯一可靠的是在提交或 PR 时强制校验。
- 用
husky+lint-staged在git commit前跑：npx prettier --check "**/*.{html,css,js}" - CI 流程（如 GitHub Actions）中加一步：
npm run format:check，失败则阻断合并 - 错误信息会明确指出哪几个文件没过检查，例如：
src/components/header.html 12:5 — Expected line ending to be 'LF' but found 'CRLF'，直接定位环境问题
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
