Vue 全局使用Sass

1、安裝依賴

npm install node-sass --save-dev //安裝node-sass 
npm install [email protected] --save-dev //安裝sass-loader 
npm install sass-resources-loader --save-dev //sass-全局使用
           

2、修改webpack.base.conf規則

module: {
	rules: [
		{
			test: /\.sass$/,
			loaders: ['style', 'css', 'sass']
		}
	]
}
           

3、修改utils.js檔案，設定scss主檔案路徑

return {
	css: generateLoaders(),
	postcss: generateLoaders(),
	less: generateLoaders('less'),
	sass: generateLoaders('sass', { indentedSyntax: true }),
	// scaa全局使用修改部分
	scss: generateLoaders('sass').concat(
		{
			loader: 'sass-resources-loader',
			options: {
				//你自己的scss全局檔案的路徑
				resources: path.resolve(__dirname, '../src/css/index.scss')
			}
		}
	),
	// scss: generateLoaders('sass'), //注釋原來的
	stylus: generateLoaders('stylus'),
	styl: generateLoaders('stylus')
}