[JavaScript] Webpack - Module Keyword - 가져오기

Webpack

Module Keyword로 가져오기

ESM 표준을 사용하여 가져오는 방법

import 모듈_이름 from 모듈_위치

ESM 표준을 사용하여 내보내는 방법

export, export default

첫번째로 export를 사용하여 Module에 접근하는 방법

const width = 4;
const getSquareArea = height =>  height * width;

export {
    width,
    getSquareArea
}

// mathUtils에서 내보낸 getSquareArea를 받아줍니다.
import {getSquareArea} from './mathUtils'

const result = getSquareArea(4);
console.log(result)	//12

두번째로 export default를 사용하여 Module에 접근하는 방법

const width = 4;
const getSquareArea = height =>  height * width;

export default{
    width,
    getSquareArea
}

// default로 내보낸것을 받기 위해서는 전체를 받아주어야 하고,
import mathUtils from './mathUtils'

//default를 사용하게되면 mathUtils 자체에 접근하여 키 값으로 접근하여야 합니다.
const result = mathUtils.getSquareArea(4);
console.log(result)	//12