Browser direct ES6 from node_modules

<script type="module">     
    import * as THREE from "./node_modules/three/build/three.module.js";
    import { Interaction } from "./node_modules/three.interaction/build/three.interaction.module.js";

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

Both files load successfully. Why this error?

You may want to continue the thread in Import ES6 modules installed with NPM raather than starting a new one — there isn’t enough context here for others to help you. But tl;dr the three.interaction module not designed to be used this way: many packages on npm aren’t. That package does require a bundler of some kind.

the browser spec is not compatible with node resolution, most if not all npm packages will fail, the only exceptions are packages without dependencies - everything else won’t work. if you go this path all that awaits you is pain, the browser stuff is years from usable.

i would suggest removing script tags all together, pick any bundler and you’re good to go. if you dislike the idea of setting something up, use codesandbox and click “download” to get a working project: you can import from three.interaction in there.