Inline SVGs with no styles when build/generate

mickaelchanrion commented 4 years ago

Hi! When using vue-svg-loader (?inline), if the svg file contains <style> in the defs, then it will apparently be ignored and the svg will be with no style once the Nuxt app is built/generated.

Issue #24 was about that problem and it is now closed, yet I think no effective solution has been provided so far. So ok, we can use the raw-loader but still, the original problem remains hence a new issue.

In a project, I ended up fixing that issue by replacing the loader by svg-to-vue-component:

function setup(config, options = {}) {
  // ...
  const rule = {
    test: /\.svg$/i,
    oneOf: [
      {
        resourceQuery: /inline/,
        use: [
          'vue-loader',
          {
            loader: 'svg-to-vue-component/loader',
            options: options.inline,
          }
        ],
  // ...

It seems to be working well. Should I open a PR?

sam3d commented 4 years ago

I'll happily accept a PR! Please could it use a resourceQuery of /component/? Thank you 😄

mickaelchanrion commented 4 years ago

Ok so I keep the inline one?

sam3d commented 4 years ago

Yes please. I’d like to avoid breaking changes if possible.

On 14 Oct 2020, at 12:26, Mickael Chanrion notifications@github.com wrote:

Ok so I keep the inline one?

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/nuxt-community/svg-module/issues/61#issuecomment-708339934, or unsubscribe https://github.com/notifications/unsubscribe-auth/AB77H6F66BKXBMKVEJDG35DSKWDFFANCNFSM4SQOF5AA.

nuxt-community / svg-module

Inline SVGs with no styles when build/generate #61