Demo does not work locally: three.module.js: No such file or directory

[hirako2000]

Trying to run the demo locally, it fails during build, to copy some module.

It can quite easily be fixed by making the demo a proper npm project.

• Add a package.json to the demo folder, with its own dependency structure
• No need to local copy any node_modules, it will execute the project closely the same way as a consumer of the library would
• Pull the dependency locally so that local changes can be observed with the demo project

Current behavior:

npm run build

> @mkkellogg/[email protected] build-demo
> mkdir -p ./build/demo && cp -r ./demo ./build/ && cp ./node_modules/three/build/three.module.js ./build/demo/lib/three.module.js

cp: ./node_modules/three/build/three.module.js: No such file or directory

npm run demo. Log look fine, but only the landing page works. When clicking a model, it does not render anything.

> @mkkellogg/[email protected] demo
> node util/server.js -d ./build/demo

Server running at 0.0.0.0:8080

-----------------------------------------------
HTTP(200) Request for ./build/demo/index.html
HTTP(200) Request for ./build/demo/assets/images/garden.png
HTTP(200) Request for ./build/demo/assets/images/truck.png
HTTP(200) Request for ./build/demo/assets/images/bonsai.png
HTTP(200) Request for ./build/demo/assets/images/stump.png
HTTP(200) Request for ./build/demo/assets/images/dynamic_scenes.png
HTTP(404) Request for ./build/demo/lib/three.module.js -> File not found.
HTTP(200) Request for ./build/demo/lib/gaussian-splats-3d.module.js
HTTP(200) Request for ./build/demo/assets/images/bonsai.png

-----------------------------------------------
HTTP(200) Request for ./build/demo/garden.html
HTTP(200) Request for ./build/demo/js/util.js
HTTP(404) Request for ./build/demo/lib/three.module.js -> File not found.
HTTP(200) Request for ./build/demo/lib/gaussian-splats-3d.module.js

[mkkellogg]

cp: ./node_modules/three/build/three.module.js: No such file or directory

For some reason, it cannot find the three.js package installation, are you running npm install as your first step?

[hirako2000]

Edited: tone and intent correction.

three is peer dependency.

[seppestaes]

Installing three can do the trick? For my use case (DropInViewer, Monorepo) having three as a peerDependency makes a lot of sense.

[hirako2000]

Installing three can do the trick

no, installing three 1/ does not address the issue 2/ would merely work around a bug. Better fix the bug.

[seppestaes]

cp: ./node_modules/three/build/three.module.js: No such file or directory Can you verify whether three is installed? (cf your error message)

[hirako2000]

I confirm that (manually) installing the three npm library in the main project fixes the build. I also observed by trying to build the main project (npm run build), that it triggers the demo build (build-demo) script as well. Thus returning an error as well.

The simple fix would be to

• Add three as a dev dependency

It would be a sane patch, since builds depend on demo, which depends on a copy of a locally present module. It is a hack though to cmd copy a file from the node_modules.

A better fix:

• npm init the demo folder
• add three.js as a (non dev) dependency.
• refactor module imports scattered across multiple html files
• skip build-demo when running the main build

module linking provides a better dev experience and will avoid bugs of this type, skips having to maintaining custom 'build' scripts. Also, npm supports workspaces.

npm run build

> @mkkellogg/[email protected] build
> npm run build-library && npm run build-demo


> @mkkellogg/[email protected] build-library
> npx rollup -c && mkdir -p ./build/demo/lib && cp ./build/gaussian-splats-3d.module.* ./build/demo/lib/


./src/index.js → ./build/gaussian-splats-3d.umd.cjs, ./build/gaussian-splats-3d.umd.min.cjs...
created ./build/gaussian-splats-3d.umd.cjs, ./build/gaussian-splats-3d.umd.min.cjs in 1.7s

./src/index.js → ./build/gaussian-splats-3d.module.js, ./build/gaussian-splats-3d.module.min.js...
created ./build/gaussian-splats-3d.module.js, ./build/gaussian-splats-3d.module.min.js in 1.5s

> @mkkellogg/[email protected] build-demo
> mkdir -p ./build/demo && cp -r ./demo ./build/ && cp ./node_modules/three/build/three.module.js ./build/demo/lib/three.module.js