Comments (4)
When you use this plugin the SVGs you import should rather reside within your "source" folder. Note that when used like this the SVGs are more or less compile-time resources rather than runtime resources, hence why you shouldn't put resources used by this plugin in the static
folder.
from sveltekit-svg.
Correct me if I'm wrong, but this is a warning and not an error, right?
From what I can tell this is a warning from Vite so this seems like something I can't fix in the plugin. I managed to find this deep inside Vite:
// check if public dir is inside root dir
const publicDir = normalizePath$4(server.config.publicDir);
const rootDir = normalizePath$4(server.config.root);
if (publicDir.startsWith(rootDir)) {
const publicPath = `${publicDir.slice(rootDir.length)}/`;
// warn explicit public paths
if (url.startsWith(publicPath)) {
logger.warn(source.yellow(`files in the public directory are served at the root path.\n` +
`Instead of ${source.cyan(url)}, use ${source.cyan(url.replace(publicPath, '/'))}.`));
}
}
My reading of this is that you either have to live with the warning, or simply move the SVG you'r importing as a component within your source directory.
Also, this warning only seems to occur when running svelte-kit dev
.
Unless you provide some further info about this problem (Svelte version, adapter type, is it dev/prod mode, is it building correctly or not, etc...) I will close this issue in a couple of days.
Thanks for the report nonetheless.
from sveltekit-svg.
Ok, it definitely seems to be a development warning only, when the project is built, it put the SVG inline in HTML and the warning does not accours.
I am using SvelteKit in next
version (at least this is what it says in package.json), and the adapter-static
to build. Using this adapter, I think there is no need of put the SVGs inside static
folder.
from sveltekit-svg.
This is what I was intended to do, I thought the SVG are put inline in runtime, not in build, so I put then in static
folder in order to cache them with a service worker.
But as they are generated in build time, I move them to source
folder and the warning goes away, but even using static
folder, it builds normally, the warning is only when in development.
from sveltekit-svg.
Related Issues (20)
- SSR true HOT 7
- Support alternative datauri encodings HOT 2
- Error: <Btn_Next> is not a valid SSR component. HOT 18
- Svelte 4 support HOT 1
- Import SVG component dynamically based on input that the component is getting HOT 2
- Using SVG as component is giving me an error? HOT 4
- Render the contents of the `<svg>` tag using `{@html}` in the component mode HOT 6
- Add a hook to allow plugin users to modify the resulting component HOT 3
- `Error: Cannot find module 'svgo'` HOT 4
- Simplify library usage for common usage HOT 7
- Sourcemap issues HOT 6
- Get SVGSVGElement from generated component HOT 2
- Not a valid SSR component HOT 2
- PSA: css selectors that target an imported `.svg` are considered `unused` and are pruned HOT 1
- `?url` + SVGO? HOT 11
- Svelte 5 Support HOT 8
- Error: Cannot find module '@rollup/pluginutils' HOT 6
- Fails to compile in Svelte 5: "Invalid compiler option: css: "none" is no longer a valid option" HOT 1
- This svg does not work when imported as component or src, but does when used used directly HOT 7
- Trying to install it with the rc version `svelte@"^5.0.0-next.123"` seems to be failing with this error,
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from sveltekit-svg.