Live server only shows blank white screen instead of black background

Questions
1

I am trying to set up my three.js according to tutorials I found on Youtube. I use Visual Studio Code and I copy the script exactly but for whatever reason when I check the live server it always shows me a blank white page when it’s supposed to be black.

I have not been able to install the recommended npm to my software so I am wondering if the issue is the bootstrap CDN from Cloudflare that I put in the html section ?

I also notice when I input text like
const renderer = new THREE.WebGLRenderer();
or
const scene = new THREE.Scene();

the script turns blue.
All of the tutorials I watch online show this line of the code turning green not blue.

https://codepen.io/m0nam0nam0na/pen/qBKXvpb

Could any of this be the reason I am not getting a black background when I access the live server?

UPDATE:
I put http://127.0.0.1:5500/index.html (the white page) in the web browser clicked on "inspect element’ and received

[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (mains.js, line 0)
[Error] Refused to execute http://127.0.0.1:5500/mains.js as script because "X-Content-Type: nosniff" was given and its Content-Type is not a script MIME type.

> Selected Element
< <html lang="en">…</html>

any input helps - thanks!

2

Please provide a live version of your code in jsfiddle or codepen where it can be checked for errors and then you can try to transfer it to your server and see if it works there.

3

Thank you will do.

I put http://127.0.0.1:5500/index.html (the white page) in the web browser clicked on "inspect element’ and received

[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (mains.js, line 0)
[Error] Refused to execute http://127.0.0.1:5500/mains.js as script because "X-Content-Type: nosniff" was given and its Content-Type is not a script MIME type.

> Selected Element
< <html lang="en">…</html>

I have no idea what this means

4

Hey I am facing the same issue, did you find the solution for it?

5

Hi @mona and @Ansh …

Now, the necessary files for Three.js come from ‘cloud’, basically from https://unpkg.com/…

Please, for example, copy the code of:

https://jrlazz.eu5.org/anim/axes_04.html

and try to run in Your html local server.

Write me if this helps.

PS1: I am currently uninstalling a lot of files from my computer and using the cloud and my simple html server to work with Three.js. :slightly_smiling_face:

PS2: And You can choose the version of Three.js in the lines 17 and 18.