在create-react-app中配置全局预处理scss

在暴露配置的前提下，打开config文件夹里面的webpack.config.js

直接ctrl+f搜索 ->sassRegex。找到下面这段loader配置

{

              test: sassRegex,

              exclude: sassModuleRegex,

              use: getStyleLoaders(

                {

                  importLoaders: 3,

                  sourceMap: isEnvProduction && shouldUseSourceMap,

                },

                "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,

            },

修改为下面这样，也就是使用concat拼接

{

              test: sassRegex,

              exclude: sassModuleRegex,

              use: getStyleLoaders(

                {

                  importLoaders: 3,

                  sourceMap: isEnvProduction && shouldUseSourceMap,

                },

                "sass-loader"

              ).concat({

                loader: "sass-resources-loader",

                options: {

                  resources: [

                    // resolve方法第二个参数为scss配置文件地址，如果有多个，就进行依次添加即可

                    path.resolve(__dirname, "./../src/assets/global.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,

            },