Parcel自动处理CSS需匹配入口方式与配置：JS中import触发构建但不自动注入DOM，开发时HMR注入style标签，生产时输出独立CSS文件；autoprefixer依赖browserslist配置，SCSS/LESS需手动安装sass/less，CSS Modules仅识别.module.css后缀。
Parcel 会自动识别并处理 CSS 引入，但“自动”不等于“无条件生效”——它依赖入口方式、文件后缀、构建模式和项目配置是否匹配。直接结论：只要入口是 index.html 或 JS 中用了 import './style.css'，Parcel 就会解析、转译、注入（开发）或提取（生产），无需额外 loader 或插件。
为什么 import './style.css' 有时没效果？
根本原因不是 Parcel 没打包，而是它不主动向 DOM 插入样式 —— 它只生成资源或内联字符串，插入行为需环境配合。
-
parcel serve模式下：CSS 会被 HMR 注入为<style>标签，所以改完立刻生效 -
parcel build模式下：CSS 默认输出为独立bundle.css文件，但不会自动在 HTML 中加<link>—— 如果你只靠 JSimport，而 HTML 里没写<link href="...">，构建后页面就无样式 - 想让 JS 主动注入，得用
import * as cssText from './style.css?inline'，然后手动创建<style>标签
autoprefixer 不生效？先看 browserslist
Parcel 内置 autoprefixer，但它只按 package.json 里的 browserslist 字段启用。没配，就 fallback 到默认值 "> 0.5%, last 2 versions, not dead"，这基本不兼容 IE11 或旧安卓 WebView。
- 检查
package.json是否有browserslist字段，例如："browserslist": ["IE 11", "last 1 version"] - 别指望
postcss.config.js能覆盖内置行为：Parcel v2+ 读它，但仅当配置导出的是对象（不能是函数），且所有插件已安装；否则静默跳过 - 内置 autoprefixer 版本较旧（v10.4.x），如需新特性（如
grid: 'no-autoplace'），必须显式配插件并安装
SCSS/LESS 引入报 “Cannot find module 'sass'” 怎么办？
这不是配置问题，是 Parcel v2.12+ 默认关闭了 auto-install 行为。它检测到 @import 'xxx.scss' 或 import './x.scss' 后，只检查本地有没有 sass（Dart Sass），没有就报错，不会帮你 npm install。
立即学习“前端免费学习笔记（深入）”；
- 运行
npm install --save-dev sass（SCSS）或npm install --save-dev less（LESS） - 别装
node-sass：已废弃，Parcel v2+ 不认 - SCSS 中用
@import 'vars'时，确保被导入文件名是_vars.scss（以下划线开头），否则 Parcel 可能把它当入口单独打包 -
@import 'normalize.css'能解析 npm 包，但前提是该包已安装且导出 CSS（normalize.css可以，lodash不行）
CSS Modules 怎么开？
CSS Modules 默认关闭，Parcel 不靠配置文件启用，只靠文件后缀识别。
- 必须把文件命名为
Button.module.css（含.module.） - JS 中用
import styles from './Button.module.css'，Parcel 才自动开启模块化并导出类名对象 - 普通
.css文件即使写了modules: true在postcss.config.js里，也不会变成模块 —— Parcel 不走那条路径 - HTML 中的
<link href="xxx.module.css">不生效，模块 CSS 只能通过 JSimport使用
最常被忽略的一点：Parcel 对 CSS 的“自动”处理高度依赖上下文。它不强制你写什么，但如果你混合使用 <link>、JS import、?inline、.module.css，又没理清它们各自的作用域和输出逻辑，很容易出现样式丢失、重复注入或作用域错乱 —— 这些都不是 bug，是机制使然。
