Vue-svg-loader: Add option for string loading

[dcrystalj]

As we have ?external it would be nice to have ?raw and get svg loaded as string?
Or is this possible already?

[visualfanatic]

Yes, it's currently possible by using raw-loader, you need to modify your webpack config like so:

module.exports = {
  module: {
    rules: [
      {
        test: /\.svg$/,
        oneOf: [
          {
            resourceQuery: /raw/,
            loader: 'raw-loader',
          },
          {
            loader: 'vue-svg-loader',
          },
        ],
      },
    ],
  },
};

[dcrystalj]

in case if anyone is interested. there is also a way to inline svg and convert it to base64 so you dont need extra request when adding image to css.

config:

.oneOf('base64')
      .resourceQuery(/base64/)
      .use('url-loader')
      .loader('url-loader')
      .end()
      .end()

css:

    .icon-img {
      background-image: url('~@/assets/error.svg?base64');
    }