HTML本身不支持多端版本分支，所谓“多端发布”实际是靠Git对整套静态资源（index.html、css/、js/、图片等）做差异化快照管理，再配合构建或部署流程定向输出。
HTML 文件本身不支持多端版本分支，所谓“多端发布”实际是靠 Git 对整套静态资源（index.html、css/、js/、图片等）做差异化快照管理，再配合构建或部署流程定向输出。没有“HTML 内置分支机制”，强行在单个文件里塞多端逻辑只会让维护崩溃。
git checkout 切换的是整套 HTML 快照，不是某个页面的“模式”
很多人误以为改个 data-theme="dark" 就算分支，其实那只是运行时状态。Git 分支管理的对象是整个目录树——git checkout feature-mobile 后，你看到的不只是 index.html 不同，连 css/mobile.css、js/app.mobile.js、甚至 images/logo-mobile.png 都是该分支独有的完整集合。
- 分支名要带上下文，比如
feature-mobile-layout、release-webview-v2，避免用模糊词如v2或new - 切分支前务必
git status确认工作区干净；有未提交修改时，git stash比硬切更安全 - 不要在
main分支上直接改 HTML —— 一旦 push，就等于把“移动端适配版”当生产版发布了
构建脚本必须区分分支，不能只靠 HTML 注释识别端类型
<!-- PLATFORM: mobile --> 这类注释对 Git 无意义，构建工具也几乎不读它。真正起作用的是 CI/CD 流程中根据 CI_COMMIT_BRANCH 或 GIT_BRANCH 环境变量触发不同构建逻辑。
- Webpack/Vite 构建时，用
process.env.BUILD_TARGET控制入口文件和 CSS 变量注入，而不是在 HTML 里写if (platform === 'mobile') - 静态站点生成器（如 Hugo、VuePress）应为每个端配置独立
config，通过hugo --environment mobile启动 - 禁止在 HTML 中用
<script>document.write(...)</script>动态加载“多端 JS”——这会让缓存失效、首屏变慢、SEO 失效
预览多端分支不能只靠本地浏览器双开，得用 worktree 或容器隔离
用 git checkout feature-tablet 再打开 index.html 是最简方式，但多个分支同时开发时会频繁切换，容易误操作。更稳的做法是用 git worktree 开多个物理目录，各自绑定一个本地服务端口。
立即学习“前端免费学习笔记（深入）”；
- 执行
git worktree add ../myapp-mobile feature-mobile-layout，就会生成独立文件夹，可单独npm run serve - 若用 Python 的
http.server，确保每次都在对应 worktree 目录下运行，否则看到的还是旧分支内容 - 移动端真机调试时，别用
localhost：改用http://192.168.x.x:8080并关掉防火墙，否则手机根本连不上
最常被忽略的一点：分支合并前，必须验证所有端对应的资源路径是否仍有效。比如 feature-pwa 分支新增了 manifest.json，但 main 分支的 index.html 里没加 <link rel="manifest">，合进去就直接导致 PWA 功能丢失——这种问题不会报错，只会静默失效。
