React Load scss style模块化

0、yarn eject (通过creat-react-app创建的项目)

1、yarn add sass-loader

2、yarn add node-sass

3、config/webpack.config.dev.js

101行

module: {
   strictExportPresence: true,
   rules: [
       //增加
         {
           test: /\.scss$/,
           loaders: ['style-loader', 'css-loader?modules', 'sass-loader?modules'],
         }
  ],
}

205行

{
    // Exclude `js` files to keep "css" loader working as it injects
    // its runtime that would otherwise processed through "file" loader.
    // Also exclude `html` and `json` extensions so they get processed
    // by webpacks internal loaders.
    
    //exclude: [/\.(js|jsx|mjs)$/, /\.html$/, /\.json$/],
    
    exclude: [/\.(js|jsx|mjs)$/, /\.html$/, /\.json$/,/\.scss$/],
    loader: require.resolve('file-loader'),
    options: {
        name: 'static/media/[name].[hash:8].[ext]',
    },
},

4、config/webpack.config.prod.js

同步骤3