search

jpkleemans / vite-svg-loader

Vite plugin to load SVG files as Vue components
MIT License
585 stars 61 forks source link

Component imports stopped working in version 3.3.0 #51

Closed cslettengren closed 2 years ago

cslettengren commented 2 years ago

import myIcon from '@assets/myIcon.svg?component'; is importing the icon as a url string since version 3.3.0

Oleksii14 commented 2 years ago

Also having this issue

jpkleemans commented 2 years ago

Hi, I've tested it but it still works for me. Could you create a Code Sandbox to illustrate the problem?

cslettengren commented 2 years ago

It is only broken when you try running the built javascript files, which makes sense since this is what changed in version 3.3.0: const isRootRef = viteConfig.command === 'build' && !id.startsWith(viteConfig.root) if (!id.match(svgRegex) || isRootRef) { return }

In my case I guess isRootRef will be true and that's why it's returning before even considering what kind of import it should be.

chriscalo commented 2 years ago

Just wanted to confirm that I was running into this in my production builds (even though dev worked perfectly) and updating the vite-svg-loader version to 3.2.x fixed it for me.

jpkleemans commented 2 years ago

It is only broken when you try running the built javascript files, which makes sense since this is what changed in version 3.3.0: const isRootRef = viteConfig.command === 'build' && !id.startsWith(viteConfig.root) if (!id.match(svgRegex) || isRootRef) { return }

In my case I guess isRootRef will be true and that's why it's returning before even considering what kind of import it should be.

@cslettengren thanks for your clarification. Now the trick is to figure out why isRootRef becomes true. Could you share your alias configuration in vite.config.js?

jpkleemans commented 2 years ago

I've removed the isRootRef check in v3.4.0. So this should be fixed!