先检查extract配置：Rollup默认跳过.css文件，必须在postcss()中显式设置extract:true或extract路径；其次确认入口JS有import './Button.css'；最后检查output.assetFileNames是否配置，否则CSS会被塞入JS文件。
import './Button.css' 没生成 CSS 文件？先看 extract 配置
Rollup 默认跳过所有 .css 文件，插件不显式声明提取逻辑，就不会落地为物理文件。最常见静默失败就是漏了 extract: true 或 extract: 'dist/index.css'。
如果你看到打包后只有 JS、没 CSS，优先检查三点：
-
postcss()插件配置里是否写了extract: true（或具体路径） - 入口 JS 文件里是否真有
import './Button.css'—— 没这行，插件根本不会触发 -
output.assetFileNames是否配置，否则生成的 CSS 会被塞进dist/xxx.js里，看着像“没打包”
想让类名带 hash 隔离作用域？modules: true 不是可选项
只写 import './Button.css'，即使配了 postcss()，类名仍是全局的。CSS Modules 必须显式开启：modules: true，且推荐搭配 exportLocalsConvention: 'camelCase'。
注意命名约定：
立即学习“前端免费学习笔记（深入）”；
- 默认只对
.module.css后缀自动启用模块化；若用.css，需在插件中加include: ['**/*.css'] - 启用后，必须用
import styles from './Button.module.css'，不能写import './Button.module.css'（后者只注入样式，不导出类名） - 避免出现
var css = "._overlay_xxx{}"这种字符串拼接——那是插件误把 CSS 当 JS 模块处理了
多 JS 格式输出时，CSS 文件要不要也多份？
不要。Rollup 的 output 数组支持生成 ESM/CJS/UMD 多种 JS 格式，但 CSS 应只产出一份物理文件（如 dist/index.css），被所有 JS 入口共用。
重复输出 CSS 的典型信号：
- 在多个
output配置里都写了extract: true，且没统一路径 - 混用了
rollup-plugin-import-css和rollup-plugin-postcss，导致同一份 CSS 被不同插件分别处理 - JS 中既
import styles from './X.css'又import './X.css'，形成隐式双重依赖
压缩和自动前缀为什么没生效？PostCSS 插件链顺序错了
rollup-plugin-postcss 自身不压缩、不加前缀，全靠传入的 PostCSS 插件数组。常见失效原因不是没装插件，而是调用方式不对：
- 必须传函数调用结果：正确是
[require('autoprefixer')(), require('cssnano')()]，错误是[require('autoprefixer'), require('cssnano')] -
cssnano要放在postcss-url之后，否则 base64 内联资源可能被误删 - 别信
minify: true这类插件内置开关，它往往无效；真正起效的是cssnano插件本身
真正卡住体积和作用域的，从来不是插件选得对不对，而是你有没有切断 JS 模块对 CSS 文件的隐式依赖链——比如一个 import 语句，既触发样式注入，又悄悄把整份 CSS 编译成 JS 字符串塞进 bundle。
