rollup本身不处理html文件，多页面打包必须依赖插件协同；多个input只生成多个js bundle，不会自动生成html；需为每个页面配置独立的@rollup/plugin-html实例，指定template和filename，并正确设置publicpath以确保script路径正确。
Rollup 本身不处理 HTML 文件，多页面打包必须靠插件协同，不是加几个 input 路径就能自动产出多个 HTML —— 这是新手最容易卡住的地方。
为什么 rollup.config.js 里写多个 input 不会生成多个 HTML
Rollup 的 input 只接受 JS 入口文件（如 src/page1/main.js），它不会读取或解析 HTML。即使你配了 ['src/page1/main.js', 'src/page2/main.js']，输出的也只是多个 JS bundle，没有 HTML 文件生成，更不会自动注入 script 标签。
-
@rollup/plugin-html每次调用html()插件只处理一个模板，生成一个 HTML 输出 - 每个页面需要独立的
html()实例，且每个实例必须指定自己的template和fileName - 多个
html()插件可以共存，但不能共享同一份配置对象（否则会覆盖）
如何为 page1.html 和 page2.html 分别注入对应 JS
关键在于：每个 HTML 模板要绑定唯一的 JS 入口，并确保插件能识别其依赖关系。不能让两个 html() 都指向同一个 src/index.html，也不能让它们都注入 bundle.js。
- 为每个页面建独立模板：
src/page1/index.html、src/page2/index.html - 每个
html()插件显式传入template和fileName，例如：template: 'src/page1/index.html'+fileName: 'page1.html' - 确保每个模板里有唯一占位或默认结构，比如
<div id="app-page1"></div>，避免 JS 初始化冲突 - Rollup 会根据 JS 入口的
import关系自动关联，不需要在 HTML 里手动写<script></script>
多页面共用公共脚本时的路径与注入控制
如果 page1 和 page2 都用了 shared/utils.js，而你又启用了 code splitting（比如 manualChunks），Rollup 可能生成 shared-xxx.js。这时 @rollup/plugin-html 默认只注入主 bundle，不会自动加 <script src="shared-xxx.js"></script>。
- 启用
inject: true（默认值）只注入入口 chunk 对应的 JS，不包括manualChunks输出的文件 - 若需注入分包，得手动在模板中预留位置，或用
transform函数动态追加 script 标签 - 注意
publicPath配置：所有注入路径默认相对于 HTML 输出目录，若部署在子路径下（如/admin/），需统一设publicPath: '/admin/' - 不同页面的
publicPath无法差异化设置，只能全局统一，这是插件限制
build 后 HTML 中 script 路径出错的常见原因
最常出现的是 <script src="index.js"></script> 404，或者路径变成 http://localhost:5000/src/main.js 这种开发时的相对路径错误。
-
template路径必须是真实存在的文件，且相对于当前工作目录（通常是项目根目录），不是rollup.config.js所在路径 - 输出目录
output.dir和html().fileName共同决定 HTML 最终位置，JS 路径是相对于该 HTML 文件的，不是相对于dist/ - 若
output.dir: 'dist'且fileName: 'admin/index.html'，则注入的 JS 路径会是../assets/main-xxx.js，不是assets/main-xxx.js - 不要依赖插件自动推断 public URL，生产环境务必显式设
publicPath，哪怕只是'./'
多页面打包真正的复杂点不在配置数量，而在 HTML 模板与 JS 入口的映射关系是否被插件准确捕获——漏掉一个 template 文件，或路径拼错一级，整个页面就白跑一次构建。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
