Support Forums

Svelte/Vite Build on Netlify differs from Local build

Hi everyone!
I’m currently deploying a SvelteKit (vite) project to netlify.
On every github-push, the site is rebuilt.

While the build goes through without error, it unfortunately seems not quite complete on netlify, compared to when building locally.

Looking at the build/deploy-log on netlify I actually see, that less modules are bundled that locally:

✓ 68 modules transformed.

compared to

✓ 51 modules transformed.

The deployed page is working fine, but missing all icons.
The only difference with those icons is, that they are imported dynamically:

icon = (await import(`./icons/${name}.svelte`)).default;

Again, building the page locally and uploading the build-folder manually to netlify works fine.

I already made sure the same Node-Version is running. I assume there is a way to fix this with further configuration on netlify. Anyone mind pointing me to the right direction?

Just to rule out the dynamic import possibility, could you try importing it statically?

Yes, when importing statically it builds/works as expected.

Is there a specific reason why you need to use dynamic imports then or could you use static imports too?

Yes, there is. So, any Idea why Netlify doesn’t include them and how to fix it? Again, the build works fine locally.

Hey @sltsm,

If the files are not getting bundled, could you try using the included files property mentioned here:

So you could continue using dynamic imports.

Thanks for the suggestion! I added the following to my netlify.toml

  included_files = ["src/**"]

This didn’t change anything. I’m also not using Functions, so not sure if this would have an impact anyway.

I believe SvelteKit needs the adapter Netlify plugin to work? If you’re using that, maybe you need to add the dynamic imports to the inject array mentioned here:

Also, please don’t add the entire src directory. You need to add only the icon files.