0

I'm trying to build simple website using webpack, all setting are fine, except generated background image url in css....

My folder structure:

dist/
   css/
      style.css
   images/
      img1.png
   js/
   index.html

src/
   scss/
      style.scss
   images/
      set1/
        img1.png
   js/
   index.html

style.scss

.container{
  width: 100%;
  height: 600px;
  background: url('../images/set/car.png') no-repeat;                        
}

style.css

.container{
  width: 100%;
  height: 600px;
  background: url('../images/car.png') no-repeat;                        
}

Problem is images/set folder in src not created in dist folder

my webpack.config.js

module.exports = {
  entry: {
    plugin: path.resolve(__dirname, 'src/js/plugin.js'),
    main: path.resolve(__dirname, 'src/js/index.js'),
  },
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'js/[name].bundle.js'
  },
  module:{
    rules: [
     {
       test: /\.(jpe?g|png|gif|svg)$/i,
       loader: "file-loader?name=[name].[ext]"
     }
    ]
  }
}

Please solve this issue, i referred many article but i did not get any solution

Adarsha Beleyur
  • 157
  • 1
  • 1
  • 7
  • Possible duplicate of [How to load image files with webpack file-loader](https://stackoverflow.com/questions/37671342/how-to-load-image-files-with-webpack-file-loader) – ksav Nov 06 '18 at 07:41
  • @ksav, suppose **images** folder has two sub folder namely **set1** and **set2** `{test: /\.(jpe?g|png|gif|svg)$/i, loader: "file-loader? name=/images/set1/[name].[ext]"}` i think above code not working right...? – Adarsha Beleyur Nov 06 '18 at 08:12

0 Answers0