Относительный путь в фоновом URL не работает при использовании css-модулей

Я использую реагировать-реагировать-приложение. Я поставил url: falseи включите css-модули.

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 фон не работает (если я использую абсолютный путь, он работает):

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

}

импортировать CSS

import styles from "./index.css";

1 ответ

Я не должен использовать url: false когда url в node_modules выдает err.Я должен добавить exclude: [/node_modules/] в загрузчике.

          {
        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/]
      },
Другие вопросы по тегам