Autoprefixer只处理less-loader编译后的标准CSS，需确保postcss-loader在less-loader之后、css-loader之前；必须清空手动前缀、正确配置Browserslist，并在构建流程中集成而非依赖VS Code插件或CLI临时处理。
Less 本身不生成浏览器前缀，它只负责变量、嵌套、Mixin 等语法转换；真正加前缀的是 Autoprefixer —— 但必须在正确环节、用正确配置运行，否则就“看不见前缀”。
Autoprefixer 根本没跑：检查 postcss-loader 是否在 less-loader 之后
Webpack 构建链中，postcss-loader 必须位于 less-loader 输出 CSS 之后、css-loader 解析之前。顺序错乱会导致 Autoprefixer 收不到标准 CSS，直接跳过或报错。
-
less-loader把.less编译成纯 CSS 字符串（含display: flex这类标准写法） -
postcss-loader接收这段 CSS，调用autoprefixer插件分析并注入前缀 - 如果
postcss-loader写在less-loader前面，它会收到未编译的 Less 语法（比如&:hover嵌套），直接报错或静默忽略 - 典型错误配置：
['less-loader', 'postcss-loader']→ 应改为['postcss-loader', 'less-loader']（注意：Webpack rule.use 是从右往左执行，所以实际写法常是['style-loader', 'css-loader', 'postcss-loader', 'less-loader']）
写了手动前缀，Autoprefixer 就自动放弃整条声明
一旦你在 Less 中写了 display: -webkit-flex 或 transform: -moz-transform，Autoprefixer 会认为“你已接管”，直接跳过该属性，不再补任何前缀 —— 包括本该加的 -ms- 或 -webkit-。
- 所有前缀必须清零：只保留标准语法，如
display: flex、gap: 1rem、place-content: center - 删掉所有自定义 Mixin，比如
.flex(@dir) { display: -webkit-box; display: -ms-flexbox; display: flex; }—— 这类写法不仅冗余，还会干扰 Autoprefixer 的目标识别 - 特别注意
@supports块里的内容：Autoprefixer 只处理块外的 fallback 声明，块内标准语法由浏览器原生支持逻辑决定，不加前缀
Browserslist 配置失效：不是插件坏了，是目标浏览器没覆盖到
Autoprefixer 加什么前缀，完全取决于 browserslist 配置。默认规则（如 > 0.5%, not dead）可能漏掉你真实要支持的旧版 Safari、Android Browser 或 IE11。
立即学习“前端免费学习笔记（深入）”；
- 运行
npx browserslist查看当前实际生效的浏览器列表，确认是否包含Safari 12、IE 11等关键目标 - 避免在
postcssOptions.plugins里重复写browsers参数（已弃用），统一用.browserslistrc文件或package.json中的browserslist字段 - 示例合理配置：
["last 2 versions", "not dead", "IE >= 11", "Safari >= 10", "iOS >= 10"] - 别信 “
last 5 versions” —— 它可能把 iOS 9 的-webkit-box也塞进来，而你项目根本不需要
VS Code 插件 or CLI 手动补前缀 ≠ 构建流程有效
VS Code 的 Autoprefixer 插件或命令行 npx autoprefixer 只能临时修文件，无法替代构建时集成。它们不读取你的 Webpack 配置、Browserslist 或 PostCSS 插件链，结果往往和生产环境不一致。
- VS Code 插件默认用自己内置的浏览器列表（常偏宽松），和你项目实际目标不一致
- CLI 补前缀必须显式传
-b参数，例如：npx autoprefixer -b "> 1%, IE >= 11" dist/style.css -o dist/style.css，漏掉就按默认策略走 - Windows 下用
>重定向会清空原文件，建议用--replace或先输出到临时文件再覆盖 - 真正可靠的只有构建时集成：确保
postcss-loader在正确位置 +browserslist配置生效 + 没有手写前缀干扰
最易被忽略的一点：Autoprefixer 不处理 Less 源码，只处理编译后的 CSS AST。这意味着它对变量、嵌套、Mixin 完全无感——你改的不是它能看见的代码。所有兼容性工作，必须落在“Less 输出之后、CSS 输入之前”这个狭窄窗口里。
