[JavaScript] 자바스크립트에서 모듈 가져오기 (import)

265_자바스크립트에서 모듈 가져오기

[적용]

• 모듈을 가져오고 싶을 때
• 서버의 모듈을 URL 지정하여 가져오고 싶을 때

---

[문법]

구문	의미
import { 모듈명 } from './파일명.js'	모듈 가져오기

---

[내용]

import 는 모듈을 가져오는 선언으로 다음과 같은 형식을 사용한다.

 

JavaScript  

import { 모듈명 } from '자바스크립트파일명.js';

 

import문의 from 내부에는 '.js' 확장자가 필수다.

위의 예시는 '자바스크립트파일명.js'로 표시하고 있지만, 실제 코드는 ./,/, ../ 등 주소 경로를 함께 표시해야 한다.

JavaScript          

// 자바스크립트 파일에서 모듈 불러오기
import { 모듈명 } from '자바스크립트파일.js';

// 자바스크립트 파일에서 모듈 여러개 불러오기
import { 모듈명1, 모듈명2 } from '자바스크립트파일.js';

// 모듈명1을 모듈명2의 이름으로 불러오기
import { 모듈명1 as 모듈명2 } from '자바스크립트파일.js';

// 자바스크립트 파일에서 export default로 정의한 모듈 불러오기
import 모듈명 from '자바스크립트파일.js';

// 자바스크립트 파일에서 모든 모듈을 불러와 모듈명 지정
import * as 모듈명 from '자바스크립트파일.js';

// 모듈 불러오기만 실행
import '자바스크립트파일.js';

 

서버에 업로드된 자바스크립트 파일이 ES 모듈에 대응하면,

URL을 지정해 불러오기를 할 수 있다.

JavaScript          

import * as RemoteModule from 'https://example.com/module.js';

 

 

 

---

 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김