Parcel不会自动向DOM注入CSS，开发时靠HMR注入style标签，生产时仅输出独立CSS文件且不自动添加link标签；需确保HTML显式引入或使用?inline手动注入。
Parcel 项目里 CSS 不会“自动注入 DOM”，它只自动打包和转译——是否生效，取决于你用什么方式引入、在什么模式下运行、以及 HTML 是否配合。
import './style.css' 在开发时生效，但 build 后不生效
这是最常被误解的一点：Parcel 确实会解析 import './style.css'，但它在 parcel serve 模式下靠 HMR 动态插入 <style> 标签，在 parcel build 模式下默认只输出 bundle.css 文件，不会自动往 HTML 里加 <link rel="stylesheet">。
- 开发时（
parcel serve src/index.html）：样式实时注入，改完即见 - 构建后（
parcel build src/index.html）：CSS 被提取为独立文件（如dist/xxx.css），但dist/index.html里没有<link>—— 页面白屏或无样式 - 解决办法不是改 JS，而是确保入口是 HTML，并且该 HTML 里显式写了
<link href="./styles.css">；或者改用import * as cssText from './style.css?inline'+ 手动创建<style>标签（仅适合小项目）
autoprefixer 不生效？先查 browserslist 配置
Parcel v2+ 内置 autoprefixer，但它完全依赖 package.json 里的 browserslist 字段触发，postcss.config.js 在多数情况下被忽略（除非导出 plain object 且插件已安装）。
- 没配
browserslist→ fallback 到默认值"> 0.5%, last 2 versions, not dead"，IE11、旧安卓 WebView 就不会加前缀 - 想支持 IE11？在
package.json加："browserslist": ["IE 11", "last 1 version"] - 内置的
autoprefixer版本较老（v10.4.x），若需grid: 'no-autoplace'等新特性，必须手动装autoprefixer@latest并在.parcelrc中显式配置
SCSS/LESS 报 “Cannot find module 'sass'”
这不是配置漏了，是 Parcel v2.12+ 关掉了自动安装行为。它检测到 @import 'xxx.scss' 或 import './x.scss' 后，只检查本地有没有 sass 包，没有就直接报错，不会帮你 npm install。
立即学习“前端免费学习笔记（深入）”；
- SCSS：运行
npm install --save-dev sass（必须 Dart Sass，node-sass已废弃且不兼容） - LESS：运行
npm install --save-dev less - SCSS 中
@import 'vars'要求被导入文件名为_vars.scss（以下划线开头），否则 Parcel 可能把它当独立入口打包，导致重复或缺失 -
@import 'normalize.css'能走 npm 解析，但前提是normalize.css已安装且包主入口导出的是 CSS 文件
CSS Modules 必须用 .module.css 后缀
Parcel 对 CSS Modules 的识别非常严格：只有文件名匹配 *.module.css（或 *.module.scss 等）才会启用局部作用域；style.css 或 index.module.css 都不行。
- 正确命名：
Button.module.css→import styles from './Button.module.css'生效 - 错误命名：
Button.css→ 即使写了export也没用，当成普通全局 CSS 处理 - JS 中 import 返回的是对象，不是字符串；若需要内联样式文本，得加
?inline后缀：import cssText from './Button.module.css?inline'
真正容易被忽略的是：Parcel 的“零配置”只覆盖常见路径，一旦涉及构建产物落地、HTML 注入时机、预处理器版本对齐或模块作用域边界，就必须直面它的隐式规则——而不是假设“它应该懂”。
