doesn't work with alias

[mikob]

import ErrorSvg from "../../src/assets/icons/error.svg?component";
console.log("ErrorSvg", ErrorSvg);

works.

import ErrorSvg from "@/assets/icons/error.svg?component";
console.log("ErrorSvg", ErrorSvg);

always logs a base64-encoded url.

relevant vite config:

  plugins: [
    vue(),
    svgLoader({
      defaultImport: "component", // or 'raw' or 'url'
    }),
  ],
  resolve: {
    alias: [{ find: "@", replacement: "./src" }],
  },

[jpkleemans]

Hi, I think you need to change the resolve config to:

alias: [{ find: "@", replacement: path.resolve(__dirname, './src') }],

If that doesn't work, could you share a Code Sandbox to reproduce the problem?

[mikob]

@jpkleemans nice, that worked, thank you! Would you mind helping me understand why that's needed?