Meteor Svelte can't find files I create on Ubuntu

Viewed 73

I've tried following along multiple Meteor tutorials, and I keep getting the same issue, although I haven't been able to find a solution when searching for answers.

When I try to import html files in my client/main.js, it keeps telling me it can't find those modules. For example, I have the following file:

imports/app.svelte

<header>
    <h1>Yo!</h1>
</header>

Then in my main.js:

client/main.js

import { Meteor } from 'meteor/meteor';
import App from '../imports/App.svelte';

Meteor.startup(() => {
  new App({
    target: document.getElementById("app"),
  });
});

And now I keep getting this error:

Uncaught Error: Cannot find module '../imports/App.svelte'

I'm following along a LevelUpTuts tutorial, so I'm certain I've installed the right packages etc. And as mentioned, the same happened when I tried to do the Meteor official tutorial as well as the Vue tutorial. I'm suspecting this might have something to do with Ubuntu?

1 Answers

You have a typo there in the filename: Your file is called app.svelte, but you are importing App.svelte.

You need to rename the file to be called App.svelte with capital A.


Your feeling that it has something to do with Ubuntu is sort-of-right because the file system there is by default case-sensitive, while in Windows it is by default case-insensitive. So if you previously did the same mistake in Windows, you may not have noticed it because when the application asked Windows for App.svelte, Windows happily said "yes here is your file" and sent app.svelte instead, while Ubuntu would say "no sorry I don't know about any App.svelte (only an app.svelte but you asked for App and not app, soo...)".

So, Ubuntu made your mistake visible while Windows hid it away. It's good that you ran into this issue now and not only once you were trying to deploy your code to a Linux server.

Related