-
-
Notifications
You must be signed in to change notification settings - Fork 7.2k
Closed
Labels
enhancementNew feature or requestNew feature or request
Description
I was asked to open another issue for this.
Describe the bug
Vite doesn't inline svg files when the documentation says it would.
Reproduction
https://bitbucket.org/andylizi/test-vite-svg-inline/
Expected behavior
logo.svg
should be inlined, asassetsInlineLimit
claims to inline any static asset files under the default 4kb limit.
Lines 315 to 320 in 9904cb1
/** * Static asset files smaller than this number (in bytes) will be inlined as * base64 strings. Default limit is `4096` (4kb). Set to `0` to disable. * @default 4096 */ assetsInlineLimit: number
Actual behavior
logo.svg
is not inlined.
System Info
vite
version: v1.0.0-rc.13- Operating System: Windows 10 (64-bit)
- Node version: v14.8.0
Related code
vite/src/node/build/buildPluginAsset.ts
Lines 60 to 63 in 480367b
if (!id.endsWith(`.svg`) && content.length < Number(inlineLimit)) { | |
url = `data:${mime.lookup(id)};base64,${content.toString('base64')}` | |
content = undefined | |
} |
Preferred solution
Adding support for svg inlining would be great.
Unfortunately extra steps are required to do it properly, as #1197 mentioned: Probably Don’t Base64 SVG and Optimizing SVGs in data URIs.
Alternative solution
Document this behavior in config.ts
so users wouldn't be surprised by this.
Workaround
Rename .svg
to uppercase .SVG
. This isn't ideal but it works for now.
princed, thomas-mc-work, Ragnar-Oock, polarathene, rafalolszewski94 and 42 moreartemjackson
Metadata
Metadata
Assignees
Labels
enhancementNew feature or requestNew feature or request