正确顺序是['style-loader', 'css-loader', 'postcss-loader', 'less-loader']，因loader从右往左执行，须先编译less再交由postcss处理；若顺序颠倒，postcss-loader将接收非法less语法而跳过或报错。
postcss-loader 顺序写错，CSS 根本没进 Autoprefixer
Webpack 中 loader 执行顺序是从右往左，但逻辑上必须是：Less/Sass 编译 → 输出标准 CSS → PostCSS 处理 → 最终打包。如果 postcss-loader 写在 less-loader 左边（即数组中排在前面），它收到的是未编译的 Less 语法，直接跳过或报错。
- ✅ 正确顺序：
['style-loader', 'css-loader', 'postcss-loader', 'less-loader'] - ❌ 错误顺序：
['style-loader', 'css-loader', 'less-loader', 'postcss-loader'] - Vue CLI 项目需确认
<style></style>块是否走postcss-loader；默认只对lang="postcss"生效，普通<style></style>需检查vue-style-loader+css-loader链路中是否含postcss-loader - Vite 5+ 默认启用 PostCSS，但若在
vite.config.js中显式配置了css.postcss，可能意外覆盖默认行为
browserslist 配置没生效，Autoprefixer 不知道该兼容谁
Autoprefixer 加什么前缀，完全取决于 browserslist 输出的实际浏览器列表。它不看你的印象、不猜你需求，只查 npx browserslist 的结果。常见失效场景是配置写了但没被读到，或规则语义冲突。
- 优先把
browserslist字段写在package.json里，避免多处维护和路径问题 - 别用已废弃的
overrideBrowserslist参数（比如在postcss.config.js里传） - 运行
npx browserslist确认当前匹配的浏览器版本；再跑npx autoprefixer --info看哪些属性会被处理 - 示例安全写法：
"iOS >= 13", "Safari >= 14.1", "Chrome >= 90"，比"last 2 versions"更可控 - 改了
.browserslistrc却没清构建缓存，或postcss-loader没读到该文件（它只认项目根目录或通过postcss.config.js显式指定）
写了手动前缀，Autoprefixer 直接放弃整条声明
Autoprefixer 的设计原则很明确：一旦看到任何带厂商前缀的声明（如 display: -webkit-flex 或 transform: -moz-transform），就认为“你已接管”，整条规则不再补任何前缀——包括本该加的 -ms- 或 -webkit-。
- 删掉所有自定义
.flex()、.transform()这类 Mixin，Less/Sass 文件里只保留标准语法：display: flex、gap: 1rem、place-content: center - @supports 块内不要写带前缀的 fallback；块外的标准声明才由 Autoprefixer 处理
- 像
backdrop-filter这种 Safari 仍只认-webkit-backdrop-filter的属性，需手动写前缀 + 标准版，但这是特例，不是通用策略
Autoprefixer 根本没加载，postcss.config.js 形同虚设
很多项目有 postcss.config.js，但构建工具根本没读它。Autoprefixer 不是装完就自动挂载的插件，它必须被 PostCSS 实例正确 require，且该实例必须参与 CSS 处理链。
- 在
postcss.config.js里故意require('xxx-missing-plugin')，启动构建——不报错就说明该文件根本没被加载 - Webpack 要求
css-loader的importLoaders≥ 1，否则@import的 CSS 不会进 PostCSS 流程 - 独立使用 PostCSS（如 Gulp）时，确保
gulp-postcss真正调用了autoprefixer插件，而不是只写了require('autoprefixer')却没放进插件数组 - 检查
node_modules是否真装了autoprefixer（注意拼写，不是autoprofixer或autoprefix）
-webkit- 前缀 + postcss.config.js 没被读取。调试时建议从 npx browserslist 和 npx autoprefixer --info 入手，先确认目标和能力边界，再逐层验证链路是否通畅。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
