Svelte imports error on deploy

Support
, ,
1

URL of my website: https://zen-garden-kit.netlify.app

image
image1324×528 34.4 KB

My last SvelteKit project must be running on magic or something because this new one got a weird bug I’ve never seen before. I even copy paste my configs.

It built fine on my machine???
image

<script>
	import { showSidebar } from '$lib/stores/sidebarStore';
	import List from '~icons/ph/list';

	function handleSidebar() {
		showSidebar.update((show) => !show);
	}
</script>

<header class="sidebar">
	<button class="sidebar__btn" on:click={handleSidebar}>
		<List width="32" height="32" />
	</button>
	<a href="/">
		<div class="logo">Zen Garden</div>
	</a>
</header>
2

Not particularly an issue that can be controlled by Netlify: [Support Guide] Netlify app builds locally but fails on deploy (case sensitivity)

Can verify that’s the issue here:

image

3

I honestly don’t understand how my computer can’t update the name of my file even though I recommit it multiple time. Is there a way to avoid this in the future?

image
image1115×323 25.7 KB

4

On Netlify, there’s no way to build if the case of the file doesn’t match, which as you’ve seen is a Linux limitation. If you’re unable to rename the file, I’d suggest changing the case of the import to match the case of the file name.