Add threejs on basic page

Questions
1

HI everyone

I realize this page

aaaa
aaaa673×424 55.9 KB

qqqq
qqqq1091×508 60.9 KB

i have this file
file
file980×598 76 KB

I don t understand the message of error
can I have some explication thanks

2

Maybe into index.html script without type="module" also need for file three.core.min.js
Show index.html code

3

thanks for your message

my code

code
code522×321 25.9 KB

I add the file here

file
file980×598 76 KB

4

I add module but still have the message of error

5

I made mistake. You need also three.module.js and path must be to it.

<body>
<script type="importmap">
{
"imports": {
"three": "./three.module.js",
"three/addons/": "./jsm/"
}
}
</script>
<script type="module" src=./main.js"></script>
</body>
6

what I have now

news2
news2412×270 11.6 KB

new
new548×453 43.5 KB

new3
new3655×513 49.6 KB

7

but still have

ne
ne751×279 56.7 KB

8

Can you send archive to messages. i will check at self

9

what you want said by archive the file ???

10

rar or zip archive with all files

11

ok i will send it

12

this the zip file
web.zip (210.5 KB)

and this is the course

https://www.mediafire.com/file/wbccx3c4ewurd5z/lesson3_1GKE6bUR.mp4/file

13

You forgot delete line:

image
image598×425 11 KB

Fixed index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Document</title>
</head>
<body>
    <script type="importmap">
        {
        "imports": {
        "three": "./three.module.min.js",
        "three/addons/": "./jsm/"
        }
        }
        </script>
    <script type="module" src="./main.js"></script>
</body>
</html>

Now you need file three.module.min.js instead three.module.js.
Now its works ok.

image
image398×199 4.97 KB

14

I don’t really understand your message

my html should be like this:

<body>
    

    <script type="importmap">
        {
        "imports": {
        "three": "./three.module.js",
        "three/addons/": "./jsm/"
        }
        }
        </script>

   <script src="three.module.js"></script>
   <script src="three.module.min.js"></script>
    <script type="module" src="main.js"></script>
</body>```


I should remove 
three.core.min.js
15

the file I have

1
1829×509 55.3 KB

the code

code
code554×293 43.7 KB

the message

error
error887×337 77.3 KB

16

Paste it in index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Document</title>
</head>
<body>
    <script type="importmap">
        {
        "imports": {
        "three": "./three.module.min.js",
        "three/addons/": "./jsm/"
        }
        }
        </script>
    <script type="module" src="./main.js"></script>
</body>
</html>

Files:

image
image138×109 1.51 KB

17

this

<body>
    

    <script type="importmap">
        {
        "imports": {
        "three": "./three.module.js",
        "three/addons/": "./jsm/"
        }
        }
        </script>
  
   
   <script src="three.core.min.js"></script>
   <script src="three.module.min.js"></script>
    <script type="module" src="main.js"></script>
</body>```
18

I have this

11
11867×501 88.2 KB

19

We already define three.module.js into importmap
Delete this lines:

<script src="three.core.min.js"></script>
<script src="three.module.min.js"></script>

Into main.js we have line:
import * as THREE from 'three';
It load file three.module.min.js which load also file three.core.min.js

20

ok now I have

now
now675×399 64.4 KB