autoprefixer 仅作用于 sass 编译后的 css，而非 .scss 源码；它依赖 browserslist 配置，通过 postcss 插件生效，vscode 插件仅为本地 cli 封装，需确保构建流程正确集成。
Autoprefixer 不是 Sass 的一部分，也根本不会在 .scss 文件编译阶段生效——它只作用于最终生成的 CSS 字符串。你在 Sass 里写 @include flex 或手写 -webkit- 前缀，属于过时且不可靠的做法。
为什么 Sass 里的 autoprefixer 混合宏完全无效
所谓“Sass 自动加前缀”是历史遗留误解。早期 Compass 等库提供过类似 @mixin transform 的封装，但这类混合宏：
- 不读取 browserslist，无法动态判断该加哪些前缀
- 无法覆盖所有属性组合（比如 gap + flex-wrap 的交叉场景）
- 编译后仍可能漏掉旧版 Safari 的 -webkit- 或 Android Browser 的 -webkit-
- 在现代构建链路中，它和 PostCSS autoprefixer 同时存在还会互相干扰
真正起效的只有 PostCSS 层的 autoprefixer 插件，它扫描的是「Sass 编译完成后的纯 CSS」，不是源码中的 .scss。
必须确保 CSS 文件实际经过 PostCSS 处理
常见现象：开发时看到前缀，打包后没了；或者 display: flex 在 iOS Safari 12.4 下不生效——大概率是 CSS 没走 PostCSS 流程。
- Webpack：确认
postcss-loader在css-loader之后，且css-loader的importLoaders≥ 1（否则@import的 SCSS 输出 CSS 不进 PostCSS） - Vite：默认启用，但若你在
vite.config.js中写了css.postcss对象，会覆盖默认配置，导致插件未加载 - Vue CLI：仅
<style lang="postcss"></style>显式声明才走 PostCSS；普通<style></style>依赖 vue-style-loader → css-loader → postcss-loader 链路，需手动检查 - 验证方法：在
postcss.config.js里写require('xxx')故意报错，启动构建——不报错说明该文件根本没被读取
浏览器目标必须由 browserslist 显式控制
autoprefixer 加不加前缀、加哪些，100% 取决于 browserslist 输出的浏览器范围，和你写的 CSS 内容无关。模糊配置如 "last 2 versions" 会导致给 Chrome 120 加 -webkit-，毫无意义。
- 推荐写法（放在
package.json里）："browserslist": ["> 1%", "not dead", "iOS >= 13", "Safari >= 14.1", "Chrome >= 90"] - 执行
npx browserslist查看当前匹配的实际浏览器列表 - 再跑
npx autoprefixer --info看哪些属性会被处理（例如place-items在 Safari 14.1 下不加前缀，因它压根不支持该属性） - 不要在
postcss.config.js里用browsers参数覆盖，它已被废弃，优先级低于browserslist
VSCode 插件只是本地 CLI 封装，不能替代构建流程
插件 mrmlnc.vscode-autoprefixer 实际调用的是项目本地的 npx autoprefixer，不是魔法开关。
- 必须在项目根目录安装：
npm install -D postcss autoprefixer（全局安装无效） - 必须有
postcss.config.js或.postcssrc，哪怕只写module.exports = { plugins: [require('autoprefixer')] } - 快捷键只对
.css、.scss、.pcss文件生效；.vue单文件组件中的<style></style>块默认不支持 - 光标必须落在某条 CSS 声明内部才能触发（比如把光标停在
flex两个字母之间）
最易被忽略的一点：VSCode 补全结果和构建产物不一致，往往是因为编辑器用了本地 browserslist，而构建工具读的是另一个（比如 Vite 读 package.json，插件读 .browserslistrc）。统一放到 package.json 是最稳妥的做法。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
