Importing Three.js as module

Module Import / Usage

Thanks for the help

you would really benefit from a bundler. pick any one you like: webpack, parcel, rollup, cra, etc. using raw html pages is nearly extinct for good reason. npm manages your dependencies, the bundler will resolve these dependencies for you, which is something web standards can’t do, then process/tree shake them (include what you use). in production this becomes more important, but there are thousands of other reasons. the pain and hardship of managing all this manually with a never ending array of hacks and workarounds isn’t worth it.

I can successfully import the Three files with a script written in the HTML page, as mostly suggested on this forum and several examples.

<script type="module">
     import * as THREE from './three/build/three.module.js';
    all of my functions are here !!!

Then I thought to move all of my functions to a different js file and make my code cleaner. So I replaced <script type="module">...</script> above with

<script src="myscript.js"></script>

The file myscript.js exactly contains the same js text as it was previously within
<script type="module">...</script>

But now I get an error
SyntaxError: Unexpected token ‘*’. import call expects exactly one argument.
exactly on the row
import * as THREE from './three/build/three.module.js';

What do I miss here? I have simply moved the js text to a different js file…
I tried even
<script type="module" src="myscript.js"></script>

but I get the same error.



are you just using a simple http server or a node.js server ? Shouldn’t it be

const http = require('http')
const url = require('url')

 function onRequest(request, response){
     var pathName = url.parse(request.url).pathname;
     show.showPage(response, pathName);

 console.log('server has started');


or we can use them both so as to have static content served from http-server and dynamic content served from http.createServer