1、下载包
cnpm i sass-resources-loader -D
2、config中找到webpack.config.js
// .scss 找sassRegex
// .module.scss 找sassModuleRegex
找到如下位置:
{
test: sassRegex,
exclude: sassModuleRegex,
use: getStyleLoaders(
{
importLoaders: 3,
sourceMap: isEnvProduction
? shouldUseSourceMap
: isEnvDevelopment,
modules: {
mode: "icss",
},
},
"sass-loader"
),
// Don't consider CSS imports dead code even if the
// containing package claims to have no side effects.
// Remove this when webpack adds a warning or an error for this.
// See https://github.com/webpack/webpack/issues/6571
sideEffects: true,
},
修改为如下:文章来源:https://www.toymoban.com/news/detail-550063.html
{
test: sassRegex,
exclude: sassModuleRegex,
use: getStyleLoaders(
{
importLoaders: 3,
sourceMap: isEnvProduction
? shouldUseSourceMap
: isEnvDevelopment,
modules: {
mode: "icss",
},
},
"sass-loader"
).concat({
loader:'sass-resources-loader',
options:{
resources:['./src/assets/scss/reset.scss','./src/assets/scss/gloab.scss']
}
}),
// Don't consider CSS imports dead code even if the
// containing package claims to have no side effects.
// Remove this when webpack adds a warning or an error for this.
// See https://github.com/webpack/webpack/issues/6571
sideEffects: true,
},
3、重启项目即可文章来源地址https://www.toymoban.com/news/detail-550063.html
到了这里,关于react全局scss变量的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!