1.开发环境vue+sass2.电脑系统windows10专业版3.在使用vue+sass开发的过程中，我们经常会用到sass，下面分享一下使用方法使用sass遇到的问题，希望对你有所帮助。4.首先安装sass-loadernpminstallsass-loader--save--dev5。安装sass-resources-loadernpminstallsass-resources-loader--save--dev6。使用sass-resources-loader官方配置如果使用vue-cli3+或4+，需要在项目文件的根目录下新建一个vue.config.js文件，也就是和packge在同一个目录下.json。并添加以下代码。//vue.config.jsmodule.exports={/******************下面是我自己的代码***************************主要是配置路径别名或者其他loader，不用加*********/configureWebpack:{resolve:{alias:{//路径别名'assets':'@/assets','common':'@/common','network':'@/network','components':'@/components','views':'@/views',}},},/************************************************************************/chainWebpack:config=>{constoneOfsMap=config.module.rule('scss').oneOfs.storeoneOfsMap.forEach(item=>{item.use('sass-resources-loader').loader('sass-resources-loader').options({//全局变量文件路径，如果只有一个，数组可以省略resources:['./src/assets/chenGolbal/chenGolbalcss.scss']}).end()})}}7.使用vue-cli官方配置//vue.config.jsmodule.exports={css:{loaderOptions:{//将选项传递给sass-loadersass:{//@/是src/的别名//所以这里假设你有`src/assets/chenGolbal/chenGolbalcss.scss`这个文件//注意：在sass-loaderv7中,optionnameis"data"prependData:`@import"~@/assets/chenGolbal/chenGolbalcss.scss"`},//默认情况下，`sass`选项对`sass`和`scss`都生效syntax//因为`scss`语法也是由sass-loader在内部处理的//但是在配置`data`选项时//`scss`语法要求语句末尾有分号，而`sass`不需要分号否.//这种情况下，我们可以使用`scss`选项单独配置`scss`语法scss:{prependData:`@import"~@/assets/chenGolbal/chenGolbalcss.scss";`},//传递Less.js与less-loader相关的选项less:{//http://lesscss.org/usage/#less-options-strict-units`GlobalVariables`//`primary`是全局变量字段名globalVars:{primary:'#fff'}}}}}这样配置看起来更清晰8.在chenGol中添加代码balcss.scss:@mixinchenh1{color:blue;}9.在vue组件中使用：.chenh1{@includechenh1;}10.本期教程到此结束，是不是很不错，希望对你有所帮助帮助，让我们一起努力达到顶峰
