brunch 默认不处理 html，需用 brunch-static-html 插件将 app/index.html 编译注入变量或 hash，并通过 autoinject 在 public/index.html 的 和 标记间自动插入带 hash 的资源路径。
HTML 文件怎么接入 Brunch？
Brunch 默认不处理 index.html，它只管 app/ 下的 JS/CSS/模板，HTML 是“静态入口”，得手动放进 public/。但你如果希望 HTML 也能被编译（比如注入 hash、替换变量、支持 EJS/Handlebars 模板），就得加插件或改配置。
- 用
brunch-static-html 插件：它会把 app/index.html 复制并可选地渲染（支持 .html.ejs 后缀）
- 或者直接把 HTML 放进
public/：最简单，但没法动态生成，brunch build 时原样拷贝
- 别把 HTML 放在
app/ 下又不配插件：Brunch 会报错 Unknown file extension .html
怎么让 Brunch 自动注入 JS/CSS 路径？
Brunch 的 autoInject 只对 public/index.html 生效，且要求文件里有明确的注释标记：
- 在
public/index.html 中写 <!-- inject:css --><!-- endinject --> 和 <!-- inject:js --><!-- endinject -->
- 确保
brunch-config.js 里启用了 plugins.autoInject.enabled = true（新版 Brunch 默认开）
- 如果用了
uglify-js-brunch 或 clean-css-brunch，生成的文件名带 hash，autoInject 会自动填入带 hash 的路径；否则就是 app.js 这种原始名
brunch-static-html 插件：它会把 app/index.html 复制并可选地渲染（支持 .html.ejs 后缀）public/：最简单，但没法动态生成，brunch build 时原样拷贝app/ 下又不配插件：Brunch 会报错 Unknown file extension .html
autoInject 只对 public/index.html 生效，且要求文件里有明确的注释标记：
- 在
public/index.html中写<!-- inject:css --><!-- endinject -->和<!-- inject:js --><!-- endinject --> - 确保
brunch-config.js里启用了plugins.autoInject.enabled = true（新版 Brunch 默认开） - 如果用了
uglify-js-brunch或clean-css-brunch，生成的文件名带 hash，autoInject会自动填入带 hash 的路径；否则就是app.js这种原始名
常见错误：把注释写成 <!-- inject css -->（少冒号或空格不对），Brunch 就不识别。
HTML 模板要热更新（HMR）怎么办？
Brunch 原生不支持 HTML 的 HMR——改了 index.html，浏览器不会自动刷新。但可以绕过：
- 用
brunch-static-html + watch 配合：它监听 app/*.html，改完触发 rebuild，配合 brunch watch --server 就能刷新页面
- 更稳的方式：把 HTML 当作“静态资源”，改完手动
F5；别指望它像 React 组件那样局部更新
- 注意：如果用了
autoInject，每次 rebuild 都会重写 public/index.html，所以不要直接编辑 public/ 下的 HTML，所有改动必须在 app/ 或模板源里做
为什么 build 后 HTML 里没看到 JS/CSS？
大概率是三个地方漏了：
-
brunch-config.js 里没配 files: { templates: { joinTo: 'app.js' } } —— 模板默认不打包进 JS，HTML 里自然没内容
-
public/index.html 缺少 <script src="app.js"></script>，而你又没开 autoInject
- 用了
brunch-static-html 却把 HTML 放在 public/ 而不是 app/，插件根本没运行
brunch-static-html + watch 配合：它监听 app/*.html，改完触发 rebuild，配合 brunch watch --server 就能刷新页面F5；别指望它像 React 组件那样局部更新autoInject，每次 rebuild 都会重写 public/index.html，所以不要直接编辑 public/ 下的 HTML，所有改动必须在 app/ 或模板源里做-
brunch-config.js里没配files: { templates: { joinTo: 'app.js' } }—— 模板默认不打包进 JS，HTML 里自然没内容 -
public/index.html缺少<script src="app.js"></script>，而你又没开autoInject - 用了
brunch-static-html却把 HTML 放在public/而不是app/，插件根本没运行
最容易被忽略的是：Brunch 的 joinTo 规则默认只管 JS/CSS，HTML 不参与打包流程，它永远是“外部协调者”，不是“构建产物”。想让它变智能，就得靠插件和约定路径，而不是指望配置自动猜。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
