使用CSS模块时，后台url中的相对路径不起作用

Question

I use react-react-app. I set url: false , and enable css-modules.

webpack.gonfig.dev.js(module/ rules): 
       {
        test: /\.css$/,
        use: [
          require.resolve("style-loader"),
          {
            loader: require.resolve("css-loader"),
            options: {
              importLoaders: 1,
              modules: true,
              localIdentName: "[name]__[local]___[hash:base64:5]",
              url: false
            }
          }
        ]
      },

webpack.config.prod.js:

                {
                  loader: require.resolve("css-loader"),
                  options: {
                    importLoaders: 1,
                    modules: true,
                    url: false,
                    minimize: true,
                    sourceMap: shouldUseSourceMap
                  }
                },

./index.css background doesn't work( If I use absolute path it works ):

.whiteBoardMainSection {
background-image: url(../../assets/white-board-hospital.png);

}

import CSS

import styles from "./index.css";

Answer 1

I shouldn't use url: false when url in node_modules throw err.I should add exclude: [/node_modules/] in loader.

          {
        test: /\.css$/,
        use: [
          require.resolve("style-loader"),
          {
            loader: require.resolve("css-loader"),
            options: {
              importLoaders: 1,
              modules: true,
              localIdentName: "[name]__[local]___[hash:base64:5]"
            }
          }
        ],
        exclude: [/node_modules/]
      },