빌드 도구 없이 패키지 사용하기 (feat. importmap)

import * as THREE from 'three';

위와 같이 three라는 패키지를 사용하려면 import하기 전에 npm으로 해당 패키지를 인스톨해야 되는데 인터넷이 연결되어 있지 않은 폐쇄환경이라면 사용하기가 곤란할 것이다. 물론 yarn의 offline 옵션이 있긴 하지만... 어쨌든, 패키지를 오프라인 파일로 관리를 하게 된다면 아래와 같은 방법도 하나의 선택지가 될 것이다.

<script type="importmap">
  {
    "imports": {
      "three": "패키지를 다운로드 받은 폴더/three.module.js"
    }
  }
</script>

위와 같이 해당 패키지를 미리 다운받고, 'three'라는 식별자로 정해주면

import * as THREE from 'three';

이렇게 사용하는게 가능해진다.

importmap은 패키지를 사용하기전에 먼저 정의 되어야 한다. 즉, 순서가 중요하다.