Inline SVG assets - Githubissues

richardtallent / vite-plugin-singlefile

Vite plugin for inlining JavaScript and CSS resources

MIT License

808 stars 53 forks source link

Inline SVG assets #52

Closed tk-100 closed 1 year ago

tk-100 commented 2 years ago

Dear maintainer,

first of all, thanks for your great plugin! I would like to export vue apps, containing svg graphics. Unfortunately, these files don't get inlined and I receive messages during build like:

rendering chunks (1)...WARNING: asset not inlined: assets/games.e8418186.svg

Other graphic formats, like png are handled correctly. In order to reproduce this error, I created a minimum demo project https://codeberg.org/MintApps/test

I would really appreciate any tips/help, Thomas

tk-100 commented 2 years ago

After some more reading, I can answer my own question:

Vite itself does not support inlining of SVG graphics, see the discussion https://github.com/vitejs/vite/issues/1197. I'm afraid that can't be solved in your package.

Workarounds:

Use the vite-svg-loader, which can be easily combined with your plugin
Copy the contents of the SVG-file into the HTML-Template

You might want to include a note in your README.

fweth commented 1 year ago

Same also for the favicon (which is not in assets) :)