kit
kit copied to clipboard
sveltejs
Image imports do not work with base path set
Describe the bug
Importing resources based on URL does not work if a base path is set in SvelteKit. This includes the explicit URL import (import Image from './image.png?url') as well as the implicit import for image files (import Image from './image.png').
No errors are produced in logs, the returned URL just happens to result in a 404.
Reproduction
https://github.com/WaltzingPenguin/url-import-with-base-path
- Create a SvelteKit project, responding "No" to all options
- Add an image to
src/routes(Named "thinking-orange.png" in repro) - Add to
src/routes/index.svelte
<script>
import src from './thinking-orange.png?url'
</script>
<img alt="" {src} />
- Add to
svelte.config.js:
paths: {
base: '/app'
}
Logs
No response
System Info
System:
OS: Windows 10 10.0.19043
CPU: (12) x64 AMD Ryzen 5 1600 Six-Core Processor
Memory: 5.79 GB / 15.95 GB
Binaries:
Node: 16.15.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.10 - ~\AppData\Roaming\npm\yarn.CMD
npm: 7.20.3 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome: 103.0.5060.114
Edge: Spartan (44.19041.1266.0), Chromium (103.0.1264.44)
Internet Explorer: 11.0.19041.1566
npmPackages:
@sveltejs/adapter-auto: next => 1.0.0-next.54
@sveltejs/kit: next => 1.0.0-next.360
svelte: ^3.44.0 => 3.49.0
vite: ^2.9.13 => 2.9.13
Severity
blocking an upgrade
Additional Information
1.0.0-next.336 is the latest version of SvelteKit I found where this worked as expected.
This appears to be working again as of @sveltejs/kit 1.0.0-next.377
Hi there, I try to do the same method with the new release sveltkit 1.0 and it doesn't work for me.
My version is "@sveltejs/kit": "^1.0.0".
This appears to have been a regression introduced somewhere between 1.0.0-next.572 (which I can confirm is working) and 1.0.0-next.587 (which does not work)
