1、 安装node-sass、sass-loader、style-loader
npm install node-sass --save-dev
npm install sass-loader --save-dev
npm install style-loader --save-dev
2、安装sass-resources-loader (如果不安装的话变量会报错)
npm install sass-resources-loader --save-dev
3、修改build中的utils.js
scss: generateLoaders('sass'),
修改成:
scss: generateLoaders('sass').concat(
{
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '../src/assets/main.scss') //这里写自己的文件路径
}
}
)
4、在main.js里面引入即可
import './assets/main.scss'
5、如果<style lang=“scss“>报错TypeError: this.getOptions is not a function at Object.loader
node-sass
和sass-loader
的版本冲突问题,重新卸载安装
npm uninstall sass-loader node-sass
npm install sass-loader@7.3.0 --save-dev
npm install node-sass@4.14.1 --save-dev