노드랑 리액트랑 번갈아가면서 하다보면 헷갈릴때가 있어서 정리함
import, require
- 외부 모듈 가져오는 것
- node는 commonJS를 지원 -> require만 가능
module.exports, export
- 외부에서 사용할수 있게 모듈로 내보내는 것
- node는 commonJS를 지원 -> exports, module.exports만 가능
/** moduler객체니 default로 내보내면 변수로 내보내기 때문에 한파일에 한번만 내보내기 가능 **/
// 한개만(module) 내보내기 : commonJS 방식
module.exports = {name: "react"};
// 한개만(default) 내보내기
export default React;
/** 객체로 묶어내보내기 때문에 여러개를 묶어 내보내기 가능 **/
// 여러개 내보내기
exports.name = "react";
exports.getNum = function() { return 1; }
// 여러개 내보내기
export const str = "hello";
export function getNum() { return 1; }
/** 객체로 묶어내보낸 것은 구조분해 해서 가져오거나 dot으로 접근해서 가져옴 **/
// [commonJS 방식] 한번에 가져오기
const Component = require('react').Component;
// [ES6] 한번에 가져오기
import { Component } from 'react';
// [commonJS 방식] 여러개 가져오기
const React = require('react');
const { Component } = React;
// [ES6] 여러개 가져오기
import React, { Component } from 'react';
'Ecmascript > Javascript' 카테고리의 다른 글
[Array] useful method (0) | 2020.01.10 |
---|---|
[closure] 간단한 로직으로 이해하는 클로져 (0) | 2020.01.03 |
[operator] + !! || && (0) | 2019.12.24 |
[비동기 처리] generator의 활용 -> function* (0) | 2019.12.14 |
[비동기 병렬 처리]Promise의 메서드 (0) | 2019.12.13 |