ES6 모듈성과 CommonJS 모듈성의 차이점
최근 프로젝트에서 저는 ES6의 가져오기 및 내보내기와 module.exports 및 require를 CommonJS에서 사용하는 방법에 대해 혼란스러워했습니다. 오늘은 요약해서 보세요. 혹시 잘못된 것이 있으면 조언 좀 부탁드립니다.
ES6 Modularity
import
명령은 다른 모듈에서 제공하는 기능을 가져오는 데 사용됩니다. export
명령은 해당 모듈의 외부 인터페이스를 지정하는 데 사용됩니다. 기준 치수. import
命令用于输入其他模块提供的功能;export
命令用于规定模块的对外接口。
一、 import 与 export
// 导出 a.js /** 写法一 **/ var name = 'sheep' function getSheep() { name = 'hourse' } export {getSheep} // 引入 b.js import {getSheep} from './a.js' /** 写法二 **/ var name = 'sheep' export function getSheep() { name = 'hourse' } // 引入 b.js import {getSheep} from './a.js'
二、 import 与 export defalut
export 可以有多个,export default 仅有一个
// 导出 a.js let obj = { name: 'hello', getName: function (){ return this.name } export default obj // 引入 b.js import obj from './a.js'
CommonJS 模块化
一、 require 与 module.exports
require
가져오기 및 내보내기 rrreee Babel6에서는 import를 사용하여 도입할 때 내보내기 기본값의 값을 직접 가져올 수 있지만 require로 가져온 컴포넌트인 경우 내보내기가 module.export, 내보내기 또는 내보내기 기본값인지 직접 가져올 수 있습니다. 내보내기 기본값을 가져옵니다. 기본값을 추가합니다. 위 내용은 ES6 모듈성과 CommonJS 모듈성의 차이점에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!// 导出 a.js
let obj = {
name: 'hello',
getName: function (){
return this.name
}
module.exports = obj
// 引入 b.js
let obj = require('./a.js')
rrreeerequire
는 ES6(bable이 import를 require로 변환)와 CommonJS
Summary
Babel5에서 require를 사용할 때 import된 값은 module.export에서 반환한 값이거나, import default에서 반환한 값입니다.