crazestylus 2019-07-01
参考了网上的几种方法,我总结了一种最简洁的的方法:
1、确保有安装这3个包sass-loader,node-sass,sass-resources-loader:,没有的话就安装:
npm install sass-loader node-sass --save-dev npm install sass-resources-loader --save-dev
2、修改mpvue的配置文件build/utils.js
// https://vue-loader.vuejs.org/en/configurations/extract-css.html
return {
css: generateLoaders(),
wxss: generateLoaders(),
postcss: generateLoaders(),
less: generateLoaders('less'),
sass: generateLoaders('sass', { indentedSyntax: true }),
scss: generateLoaders('sass'),
// 修改处-开始
scss: generateLoaders('sass').concat(
{
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '../src/assets/_macro.scss')// 此路径就是你定义全局scss变量的路径,可随你自己的更改
}
}
),
// 修改处-结束
stylus: generateLoaders('stylus'),
styl: generateLoaders('stylus')
}
}重新运行一下就ok了。