ASP.NET MVC Application having problems installing Three.js

Questions
1

ASP.NET MVC Application having problems installing Three.js properly

I looked online but could’nt find something that helped me, wasted a lot of time with chatgpt
At first I included three.js locally as a script
image

With my js file in wwwroot looking like this:
wwwrootjs

My project works but when i try to add an addon like OBJLoader so i can add a 3dmodel i get this error:

caught SyntaxError: Cannot use import statement outside a module.

So my question would be: How do i properly add ThreeJs to my ASP.NET MVC project so that i can add addons.

Thank you!

2

this is 90s era javascript im afraid, you’re trying to stack IIFE imports in specific order so that one writes into the namespace of the previous, nothing works like that no more. you npm install three and import it as a module. this requires a build tool. see three.js docs

you can in theory also use module script tags and import maps (also documented in the same link), but keep in mind that this will bar you from the eco system. just use vite, it will work fine in your scenario and by far is the easiest.

3

The error you’re receiving here is by missing the module type specifier, you’d want to include this in your main js script tag and make all of your addon imports through that file, like such

<script type='module' src='./main.js'>

Then inside main.js

import * as THREE from 'three'
import {GLTFLoader} from 'addons/loaders/GLTFLoader.js'

As pointed out above the installation guide covers this well.