能，Parcel 默认直接打包 HTML；以 index.html 为入口，自动解析 script/link 标签的相对路径依赖，支持 JS/CSS/图片等资源打包与转译，但要求路径准确、不支持绝对路径和动态引入。
Parcel 能直接打包 HTML 吗？能，而且默认就支持
Parcel 的设计哲学是“开箱即用”，index.html 就是它的入口点——不需要写配置、不用声明 entry、不碰 webpack.config.js 那套。你只要有一个含 <script src="app.js"></script> 或 <link rel="stylesheet" href="style.css"> 的 HTML 文件，Parcel 就能自动分析依赖、打包 JS/CSS/图片，甚至转译 TypeScript 和 JSX。
常见错误现象：Cannot resolve dependency './app.js' —— 其实不是 Parcel 问题，而是路径写错了，比如 app.js 不在 index.html 同级目录；或者用了相对路径但没注意当前工作目录（parcel index.html 必须在 HTML 所在目录下运行）。
- 入口必须是 HTML 文件，命令就是
parcel index.html（不是parcel serve或其他） - 所有资源引用必须是相对路径（
./或../），不能用绝对路径如/js/app.js - 如果 HTML 里有
<script type="module">，Parcel 默认支持，但不会自动 polyfill，老浏览器需自行处理
HTML 中的 script 和 link 怎么写才不会被忽略
Parcel 会静态扫描 HTML，只处理符合特定模式的标签。它不执行 JS，也不解析动态拼接的路径，所以写法必须“直白可静态分析”。
使用场景：引入本地 JS、CSS、字体、图片；内联 SVG 会被当作 HTML 处理，不走 asset pipeline。
立即学习“前端免费学习笔记（深入）”；
-
<script src="./main.js"></script>✅ 被识别并打包 -
<script>import('./main.js')</script>❌ 动态 import 不被 HTML 扫描捕获，得写在 JS 里 -
<link rel="stylesheet" href="./style.css">✅ 支持，且自动加 hash -
<img src="./logo.png">✅ 图片会被复制、重命名、路径自动修正 -
<link rel="icon" href="favicon.ico">⚠️ 若favicon.ico在根目录但不在项目目录下，会报错——必须放在源码目录里
开发时热更新为什么没反应？几个关键检查点
Parcel 的 HMR（热模块替换）对 HTML 本身不生效——改 index.html 会触发整个页面刷新，不是局部更新。但 JS/CSS 修改是真正热替换的，前提是引用方式正确。
性能影响：如果 HTML 里写了大量内联 <script> 或 <style>，Parcel 不会为它们做 HMR，也不会压缩或转译，纯当字符串塞进输出 HTML。
- 确保你改的是被
src引入的 JS/CSS，不是 HTML 里的内联代码 - 检查浏览器控制台有没有
HMR: connection established日志，没有说明 WebSocket 没连上（常见于代理拦截或防火墙） - VS Code 保存时启用了“保存时格式化”，可能把
src="./a.js"格式化成src="./a.js "（末尾空格），导致路径解析失败 - 修改 HTML 后页面刷新但内容没变？清一下浏览器缓存，Parcel 输出的 HTML 不带 cache-busting query，靠文件名 hash，但浏览器可能还缓存着旧的
index.html
build 后 HTML 路径出错？public 文件夹不是你想的那样
Parcel 没有 public 目录概念，也不支持类似 webpack 的 copy-webpack-plugin。所有资源必须通过 HTML 或 JS 显式引用，否则不会出现在输出里。
容易踩的坑：把 robots.txt、manifest.json 或字体文件直接扔进 public/，以为 build 会自动复制——Parcel 完全无视这个目录，除非你在 HTML 里写了 <link rel="manifest" href="./manifest.json">。
- 需要静态文件上线？把它加到 HTML 引用链中，哪怕只是加一行注释式引用：
<!-- manifest.json --><link rel="manifest" href="./manifest.json" hidden> - 想让某个 CSS 不被 CSS-in-JS 或模块化影响？用
<link rel="stylesheet" href="./reset.css" data-parcel-ignored>不行，Parcel 没这属性；正确做法是确保路径有效，并接受它被自动 postcss 处理 - 输出目录（
dist）结构严格由 HTML 中的路径决定：若index.html引用./assets/main.js，那dist/assets/main.js就存在，但dist/assets/下不会有其他未引用的文件
最常被忽略的其实是 HTML 引用路径和实际文件位置的物理一致性——Parcel 不猜，只信你写的路径。写错一个点，整个链就断了，而且错误提示往往藏在终端滚动日志里，不显眼。
