Add component name for stubbing and DevTools

[mheinzerling]

Thanks for your work on this project!

I tried to reduce my snapshot size by stubbing some large SVG-components. Unfortunately this is not working, as the component have no name right now. This is also an issue in the DevTools. I used patch-package to patch vite-svg-loader@5.1.0 for the project I'm working on. This is trying to rebuild the component name from the file name. Some edge cases might be missing.

diff --git a/node_modules/vite-svg-loader/index.js b/node_modules/vite-svg-loader/index.js
index b31b14c..5ae7a89 100644
--- a/node_modules/vite-svg-loader/index.js
+++ b/node_modules/vite-svg-loader/index.js
@@ -1,6 +1,7 @@
 const fs = require('fs').promises
 const { compileTemplate } = require('vue/compiler-sfc')
 const { optimize: optimizeSvg } = require('svgo')
+const path_ = require('path')
 
 module.exports = function svgLoader (options = {}) {
   const { svgoConfig, svgo, defaultImport } = options
@@ -54,7 +55,9 @@ module.exports = function svgLoader (options = {}) {
         transformAssetUrls: false
       })
 
-      return `${code}\nexport default { render: render }`
+      const name = path_.basename(path, '.svg').replace(/[^a-zA-Z0-9-]/g, '-')
+          .replace(/(^\w|-\w)/g, s => s.replace('-', '').toUpperCase())
+      return `${code}\nexport default { name: ${JSON.stringify(name)}, render: render }`
     }
   }
 }