JavaScript에서 흔히 import를 하는 두 가지 방법이 있다.
import vis from 'vis'; | |
const nodes = new vis.DataSet(); |
import { call } from 'redux-saga/effects'; | |
function* fetchSomething(id) { | |
try { | |
const st = yield call(...); | |
... | |
} catch (e) { | |
... | |
} | |
} |
전자는, export default
로 된 것을, 선언한 변수 (위 예제에서 vis)로 가져온다. 실제로 export 될 때의 이름은 상관이 없다. 가져온 이름으로 사용하면 된다. 따라서 위 코드를 다음과 같이 바꿔도 똑같이 동작한다.
import olaf from 'vis'; | |
const nodes = new olaf.DataSet(); |
후자의 {
를 쓰는 import는 export function call(...) { ... }
, export const call = function(...) { ... }
등의 방법으로 땡겨오는 것이며, 이렇게 export된 변수명 그대로 import 해주어야 한다.
만약에 소스에서 선언된 것과 다른 변수로 바인딩하고 싶다면 import { call as c } from 'redux-saga/effect';
와 같이 선언할 수도 있다. 이 예제에서는 짧은 변수라서 굳이 더 줄일 필요가 없었지만 굉장히 긴 멤버를 import해오는 경우에 유용하게 쓰인다.