feat: support importPathTransform config, close #9

Author: antfu

example/basic/package.json

@@ -17,6 +17,7 @@
     "typescript": "^4.1.5",
     "vite": "^2.0.2",
     "vite-plugin-components": "workspace:*",
-    "vite-plugin-md": "^0.5.1"
+    "vite-plugin-md": "^0.5.1",
+    "vite-plugin-vue-svg": "^0.1.0"
   }
 }

example/basic/src/App.vue

@@ -28,6 +28,7 @@
   <div class="block">
     <h1>Custom Resolvers (1)</h1>
     <MyCustom />
+    <CarbonSvg />
   </div>
 
   <div class="block">

example/basic/src/components/CarbonSvg.svg

@@ -3,6 +3,7 @@ import { UserConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import ViteComponents from 'vite-plugin-components'
 import Markdown from 'vite-plugin-md'
+import SVG from 'vite-plugin-vue-svg'
 
 const config: UserConfig = {
   alias: {
@@ -13,10 +14,12 @@ const config: UserConfig = {
       include: [/\.vue$/, /\.md$/],
     }),
     Markdown(),
+    SVG(),
     ViteComponents({
-      extensions: ['vue', 'md'],
+      extensions: ['vue', 'md', 'svg'],
       directoryAsNamespace: true,
       globalNamespaces: ['global'],
+      importPathTransform: path => path.endsWith('.svg') ? `${path}?component` : undefined,
       customLoaderMatcher: path => path.endsWith('.md'),
       customComponentResolvers: [
         (name) => {