Angular v17 browser-esbuild cannot use modules from `examples/jsm/..`

So currently building an app with new Angular builder browser-esbuild there are errors thrown that files imported from three/examples/jsm cannot be used. Is there any chance to change them to esmodules or any other workaround solution to this?

These files are ES Modules, and should be compatible with ESBuild (in most configurations at least). For a better answer I think you may need to share more details, e.g. complete imports and the build tool configuration, tsconfig if applicable, etc. Any way to reproduce the issue. I assume three.js was installed with npm?

You might also try:

  • include .js extension on imports, e.g. three/examples/jsm/loaders/GLTFLoader.js
  • three/addons/... instead of three/examples/jsm/... … this is an alias using package.json#exports, some bundlers support the alias and others do not.
1 Like

Thank for a fast and precise answer.
Well, looks like adding extension - .js - to all imports made it work. Also, now I see that this wasn’t a
Angular esbuild problem, which I thought it doesn’t allow CommonJS modules, and turns out it does allow them.
Will also try the aliasing, as it also something nice to have.

1 Like