Three.js Boilerplate

A Three.js Boilerplate to aid in quick prototyping.

When updating older Three.js projects, you may get a warning in the browser such as, "As part of the transition to ES6 Modules, the files in 'examples/js' were deprecated in May 2020 (r117) and will be deleted in December 2020 (r124)."

There are several steps involved in converting to use modules. This boilerplate was written to help you solve some of the issues you may have when converting your Three.js projects to use modules.

To install and start the master (ES6) branch

git clone https://github.com/Sean-Bradley/Threejs-Boilerplate.git
cd Threejs-Boilerplate
npm install
npm start

Visit http://127.0.0.1:3000

View example on CodeSandbox.io

To update threejs

npm install three@latest

Note : This boilerplate contains 3 branches

master : The minimal boilerplate using ES6 imports and script type module
before-es6-modules : The example, but using older style script imports
water : An example based on the official Three.js Ocean example

To see the before-es6-modules branch

git checkout before-es6-modules
npm install
npm start

To see the water branch

git checkout water
npm install
npm start

Video Tutorial About Importing Three.js as Module

Threejs TypeScript Course

Visit https://github.com/Sean-Bradley/Three.js-TypeScript-Boilerplate for a Threejs TypeScript boilerplate containing many extra branches that demonstrate many examples of Threejs.

To help support this Threejs boilerplate, please take a moment to look at my official Threejs TypeScript course at

Three.js and TypeScript

Discount Coupons for all my courses can be found at https://sbcode.net/coupons

Relative Import References versus Module Specifiers

If you ever see the error "Relative references must start with either "/", "./", or "../".", then that may also be related to using Module Specifiers in the client, when it was expecting a Relative Import Reference instead. You can read more about Relative Imports versus Module Specifiers at https://medium.com/threejs/module-specifiers-versus-relative-import-references-fd747980ba6f