-1

I tried to import modules from web:

import * as THREE from 'https://unpkg.com/three@0.130.1/build/three.module.js';
import { OrbitControls } from 'https://unpkg.com/three@0.130.1/examples/jsm/controls/OrbitControls';
import { GLTFLoader } from 'https://unpkg.com/three@0.130.1/examples/jsm/loaders/GLTFLoader.js';

but i get

Uncaught TypeError: Failed to resolve module specifier "three". Relative references must start with either "/", "./", or "../".

edemaine
  • 2,699
  • 11
  • 20
mari
  • 11

1 Answers1

1

I believe the first import works fine, but the example files have code that looks like

import { ... } from 'three'

If you want to keep your three import as is, I think you need to download the examples and modify them to instead import from 'https://unpkg.com/three@0.130.1/build/three.module.js'.

Alternatively, there is an experimental importmap feature that might let you define a map from 'three' to the appropriate URL.

Alternatively, this is why we typically use bundlers like Webpack to assemble all imports together.

edemaine
  • 2,699
  • 11
  • 20
  • You can use modules in browser: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import –  Jul 10 '21 at 23:46
  • @jabaa - you can, but they have to provide actual URLs when they, in turn, try to import something. They can’t use Node.js style module resolution. – Quentin Jul 10 '21 at 23:48
  • See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules – edemaine Jul 10 '21 at 23:49
  • @Quentin Yes, you have to import them in the HTML file using the URL and import them using the module name. But _"I think you need to download the examples and modify them to instead import"_ is wrong. You don't need bundlers. This answer is a comment at best. From a good/helpful answer I would expect an explanation how to import a module in a browser with HTML code. –  Jul 10 '21 at 23:52