前端开发中关于Node、ES6的模块使用
前端开发中Node的使用已经很普及,但是Node和Brower还是有一些差别。
作为小白最近在使用Vue时遇到一个模块的问题。现记录如下:
ES5之前Javascript没有好的模块管理方式,ES6中添加了export
,import
来管理模块,而NodeJS中通过require
,exports
,module.exports
来管理模块。
为什么要使用模块呢?
模块是编程语言用来组织、管理、共享代码的手段。在Javascript中一个.js
文件就是一个模块。使用模块时就有一个问题,哪些属性、方法希望对方能用,哪些不希望对方用。这就是前文说的几个关键字的作用。
NodeJS的模块管理
Node中没有js文件都包含require
,exports
,module.exports
。require
用于导入模块,exports
,module.exports
用于导出模块。
exports和module.exports是大家经常弄混的。弄明白了其实也很简单。NodeJS中每个js文件都有一个对象 module。module对象包含exports对象。当其require其他模块时NodeJS就是将module.exports对象输出,而exports对象是module.exports的引用。
ES6的模块管理
ES6中通过export
,import
来管理模块。使用时要注意{ }
的使用。export default在每个模块中只能使用一次,这样在import模块时就可以不用 { }
。
总结
从上面的介绍能看出NodeJS和ES6是两套不一样的模块管理方式,虽然本质上是一样的。但是在前端开发中就需要注意两者的区别,要知道哪些代码是NodeJS使用,哪些是ES6使用的。比如使用vue的脚手架构建出来的项目,通过Node编译,但是页面的开发却是使用ES6。所以在整个项目中我们能看到两种包的管理方式的存在,但是你也要知道什么时候用什么样的方式。
NodeJS也支持ES6的语法,但并不是100%的支持,比如在node v9.2.0中就不支持import、export,而你可以用let、const。那么有没有办法让Nodejs支持import、export呢?答案是肯定的,使用babel就行(如何使用可以参看引用1)。但是我不太建议在NodeJS中使用ES6的包管理方式,因为NodeJS默认的管理方式就挺好的。