webpack3 scss变量

webpack3 scss变量

在Webpack 3中使用SCSS变量需要进行一些配置。首先，你需要安装相应的loader来处理SCSS文件，例如sass-loader和style-loader。然后，在webpack配置文件中进行相应的配置。

首先，确保你已经安装了sass-loader和style-loader:

bash.

npm install sass-loader node-sass style-loader --save-dev.

然后，在webpack配置文件中，添加对SCSS文件的处理规则，以及配置sass-loader来识别SCSS变量。下面是一个简单的webpack配置示例：

javascript.

s = {。

// ...其他配置。

module: {。

rules: [。

{。

test: /.scss$/,。

use: [。

'style-loader',。

'css-loader',。

'sass-loader'。

]

}。

]

}。

};

以上配置中，我们使用了style-loader、css-loader和sass-loader来处理SCSS文件。其中，sass-loader会将SCSS文件编译成CSS文件，而css-loader会处理CSS文件中的import和url()等语句，style-loader则会将编译后的CSS代码以