Webpack: Is it possible to load svg with the file-loader? If yes, how?

Question

I want to load my svg via the file-loader with webpack. Is this even possible and if yes, how do I do that.

webpack.config.js

test: /\.(jpe?g|png|gif|svg)$/i,
use: [
  {
    loader: 'file-loader',
    options: {
      name:'[name].[ext]',
      outputPath: 'img/',
      publicPath: '../',
    }
  }
]

score 0 · Answer 1 · answered Nov 13 '17 at 12:31

0

I had similar problem. Just imported svg as html and then injected to your template as component. Worked perfectly for me.

answered Nov 13 '17 at 12:31

Andreew4x4

469
4
18

Thanks for your answer but I want to have my html and svg graphic in two separate files. – Dario Nov 14 '17 at 15:41

score 0 · Accepted Answer · answered Nov 14 '17 at 15:37

0

I found my fault, it was because I never used the svg in my project so it never got compiled. Now the file-loader compiles my svg too.

answered Nov 14 '17 at 15:37

Dario

618
1
11
28

Webpack: Is it possible to load svg with the file-loader? If yes, how?

2 Answers2