이 페이지의 실제 코드

<script type="importmap">
{ "imports": { "three": "https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js" } }
</script>
<script type="module">
import * as THREE from 'three';   // ← 설치·빌드 없이 이 한 줄
const scene = new THREE.Scene();
const box = new THREE.Mesh(new THREE.BoxGeometry(), new THREE.MeshNormalMaterial());
scene.add(box);
</script>

모듈 방식은 파일을 더블클릭(file://)으로 열면 막힙니다. 로컬 서버나 HTTPS 주소에서 여세요. 망분리 환경에서는 "three" 주소를 ./libs/ 아래 복사본으로 바꾸면 됩니다.

70

빌드 없는 import 한 줄

능력 사전
ES Modulesimport mapnpm·빌드 없음

빌드 없는 import 한 줄

npm 설치나 빌드 도구 없이, 브라우저가 직접 이해하는 import map과 import 한 줄로 3D 라이브러리를 불러와 화면을 그립니다. 아래 코드가 이 페이지에서 실제로 실행되는 코드입니다.