react引入公共scss

最新推荐文章于 2025-03-11 15:37:52 发布

qq_35438952

最新推荐文章于 2025-03-11 15:37:52 发布

阅读量396

点赞数

分类专栏： react

本文链接：https://blog.youkuaiyun.com/qq_35438952/article/details/119247953

版权

react 专栏收录该内容

2 篇文章

订阅专栏

第一步

 cnpm i sass-resources-loader --save-dev

第二步找到 webpack.config.js

路径在：node_modules\react-scripts\config\webpack.config.js

第三步

原始样子

{
              test: sassRegex,
              exclude: sassModuleRegex,
              use: getStyleLoaders(
                {
                  importLoaders: 3,
                  sourceMap: isEnvProduction
                    ? shouldUseSourceMap
                    : isEnvDevelopment,
                },
                'sass-loader'
              ),
              sideEffects: true,
            },

变成这样

{
             test: sassRegex,
             exclude: sassModuleRegex,
             use: getStyleLoaders(
               {
                 importLoaders: 3,
                 sourceMap: isEnvProduction
                   ? shouldUseSourceMap
                   : isEnvDevelopment,
               },
               'sass-loader'
             ).concat({
               loader: 'sass-resources-loader',
               options: {
                   resources: [
                       // 这里按照你的文件路径填写
                       path.resolve(__dirname, '../../../src/App.scss')
                   ]
               }
           }),
             sideEffects: true,
           },