installation

how to install three.js

Every three.js project needs at least one HTML file to define the webpage, and a JavaScript file to run your three.js code. The structure and naming choices below aren't required, but will be used throughout this guide for consistency.

index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>My first three.js app</title>
        <style>
            body {
                margin: 0;
            }
        </style>
    </head>
    <body>
        <script type="module" src="/main.js"></script>
    </body>
</html>

main.js

import * as THREE from 'three';

...

using a build tool

I personally use a build tool because I use frameworks. I usually never have plain html files.

To use a build tool, usually you have node.js and vite installed.. so it can use their package manager npm. Open your project in the terminal, and run these commands to install three.js:

npm install -D three

The installation should add three inside of the package.json inside the root of your project.

using a cdn

If you're not using a build tool and you have a regular html file, in the <head> of the file you have to put a script tag, so three.js can be loaded. <script src="https://cdn.jsdelivr.net/npm/three@<version>/build/three.module.js"></script>