T
T
thehighhomie2018-07-26 14:48:47
JavaScript
thehighhomie, 2018-07-26 14:48:47

Vue-svg-loader: remove all colors from icons?

I use vue cli 3.0 to build.
Installed vue-svg-loader .
Set up:

// vue.config.js
module.exports = {
  chainWebpack: (config) => {
    const svgRule = config.module.rule('svg')

    svgRule.uses.clear()

    svgRule
      .use('vue-svg-loader')
      .loader('vue-svg-loader')
      .options({
        svgo: {
          plugins: [
            { prefixIds: true }
          ]
        }
      })
  }
}

I display component icons according to the documentation, everything works, except for the styles. all colors (in particular style tags) disappear, icons become just black.
Tried experimenting with svgo:
module.exports = {
  chainWebpack: (config) => {
    const svgRule = config.module.rule('svg')

    svgRule.uses.clear()

    svgRule
      .use('vue-svg-loader')
      .loader('vue-svg-loader')
      .options({
        svgo: {
          plugins: [
            { removeViewBox: false },
            { removeUselessDefs: false },
            { removeStyleElement: false },
            { minifyStyles: false },
            { convertStyleToAttrs: false },
            { convertColors: false }
          ]
        }
      })
  }
}

still doesn't work...
How can I fix this behavior?

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question