How can I load three.js animations after deploying my website on Github?

Questions
,
1

I made a basic portfolio website using three.js. It works fine in local server but when I upload the code to github and deploy it, it doesn’t work. I only see html and CSS files but the three.js files won’t load. I even tried using gh-pages and creating dist folder but it still doesn’t work. My console has the following error:
2022-09-22

2

Do you mind sharing the link to your deployed app?

3

/cc

4

elfa6.github.io/Ayla/
It only loads HTML and CSS code but not JavaScript.

5

I’ve written an answer at stackoverflow :+1:.

6

Thank you.

7

It looks like the picture attached to it now after applying the changes you suggested. The main.js file is still not loading. Can you please guide me with that?

2022-09-23.png
2022-09-23.png553×529 11 KB

8

It does load. I see now 404 error. However there is this error:

Uncaught TypeError: Failed to resolve module specifier “three”. Relative references must start with either “/”, “./”, or “…/”.

Since you are using OrbitControls, you have to define an import map like in the official examples.

9

And how can I do that?

10

Just study one of the official examples, e.g. three.js webgl - geometry - cube.