正文
Vue-Cli 3.x 创建的项目中对 import 引入的 CSS 样式启用 autoprefixer
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
问题描述：
Vue-Cli 3.x 默认开启了 autoprefixer，但对于在 main.js 中通过 import 引入的 CSS 并没有自动添加前缀
分析原因：
autoprefixer 在项目编译的时候，会根据 loader 的规则编译相应的 CSS。Vue-Cli 创建的项目，默认只处理了 .vue 文件中的 CSS，对于直接 import 引入的样式，需要另外配置 loader 规则。
解决方案：
在 vue.config.js 中添加 CSS 规则：
module.exports = {
css: {
loaderOptions: {
css: {
// 这里的选项会传递给 css-loader
importLoaders: ,
},
less: {
// 这里的选项会传递给 postcss-loader
importLoaders: ,
}
}
}
};
importLoaders 代表的是针对 import 引入的文件，在 css-loader 前需要进行什么处理，1 代表使用 postcss 进行处理
