title: Why my Webpack does not loading background image?
body: <p><a href="https://i.stack.imgur.com/Dwiy8.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Dwiy8.jpg" alt="that is my problem"></a></p>
  
  <p>I'm fairly new to webpack but having some problems with css-loader or file-loader in react</p>
  
  <p>I'm trying to load a background-image but it doesn't work quite right. The background-image isn't shown, even though the devtools show the background-image style.</p>
  
  <p>I'm trying to load this background image via css file in React:
    background: url('../../assets/img/1017.jpg') no-repeat right;</p>
  
  <p>here is my web pack config:</p>
  
  <pre><code>[![const path = require("path");
  
  module.exports =
  {
      mode: "development",
      entry: path.resolve(__dirname,`src`, `app`),
      output:{
          path: path.resolve(__dirname,'dist'),
          filename: 'bundle.js',
          publicPath:'/'
      },
      resolve: {
          extensions: \['.js','.jsx'\]
      },
      devServer:{
          historyApiFallback: true
      },
      module: {
          rules:\[{
              test: /\.jsx?/,
              loader:'babel-loader',
              exclude: '/node_modules'
          },
          {
              test: /\.(jpg|png)$/,
              use: {
                loader: "url-loader",
                options: {
                  limit: 25000,
                },
              },
            },
  
            {
              test: /\.(jpg|png)$/,
              use: {
                loader: "file-loader",
                options: {
                  name: "\[path\]\[name\].\[hash\].\[ext\]",
                },
              },
            },
          {
              test:/\.css$/,
              use:\['style-loader','css-loader',\]
          },
         \]
      },
  </code></pre>
  
  <p>}</p>