I am in the process of learning Sveltejs and until now I have been using https://svelte.dev/repl/ to go through the tutorial, which has been working perfectly.
However, I wanted to develop and run Sveltejs applications from my machine (MacBook Air M1) - so I downloaded the provided sveltejs file and opened it in VS Code.
I installed the node_modules npm install. Then, I ran npm run dev which doesn't seem to produce an error
Nevertheless, when I open http://localhost:5000, I am presented with a blank page, and going on 'Inspect Element' presents me with an empty webpage: Screenshot of localhost:5000
I downloaded this template from https://svelte.dev/repl/ - I did not make any changes to this project yet it still malfunctions.
Any help is appreciated and thank you in advance!
It should be noted that I am new to web development and the node package manager.
The problem on the M1 mac (actually it is probably due to oSX Catalina not the M1 specifically but I haven’t checked on an intel running Catalina) is that port 5000 is in use by command center. This means that svelte can't bind to that port.
To see what ports are active on your mac run the command
lsof -nP +c 15 | grep LISTEN
When you run npm run dev you can set the port to something else that is not in conflict...This is what I ran.
PORT=54321 npm run dev
That should fix it and run for you.
Then you will access it on
http://localhost:54321
When you start your svelte projest you need this command:
npx degit sveltejs/template my-svelte-project
after you go to your project:
cd my-svelte-project
and when you are in this project you run:
npm install
npm run dev
after npm run dev normally you have an information on witch port application runs.
Then you go to src and App.svelte and you remplace code by default by your code. Normally it has to work.
Did you have a welcome page of svelte before you put your code?
here you have a good tutorial of svelte.