require和import的区别在哪

在vue+webpack的项目中，里面有使用require来引入文件，也有的用import来引入文件，两者之间是一样的吗？

---

两者的出身背景

ES6之前已经出现了js模块加载的方案，最主要的是CommonJS和AMD规范。commonjs主要应用于服务器，实现同步加载，如nodejs。AMD规范应用于浏览器，如requirejs，为异步加载。同时还有CMD规范，为同步加载方案如seaJS。

---

1. require/exports

CommonJS——听起来就很高大上的名字，就是它填补了JS没有模块的空能空缺，它的目标是让JS不止在浏览器中运行，可以在各个地方都能运行，或者说是提供一个类似Python，Ruby和Java标准库。

而NodeJS是以CommonJS规范实现，Webpack也是以CommonJS规范书写的

node.js的模块系统，就是参照CommonJS规范实现的。在CommonJS中，有一个全局性方法require()，用于加载模块。

---

CommonJS定义的模块分为:{模块引用(require)} {模块定义(exports)} {模块标识(module)}

2. import/export

ES6在语言规格的层面上，实现了模块功能，而且实现得相当简单，完全可以取代现有的CommonJS和AMD规范，成为浏览器和服务器通用的模块解决方案。

---

ES6模块主要有两个功能：export和import

export用于对外输出本模块（一个文件可以理解为一个模块）变量的接口

import用于在一个模块中加载另一个含有export接口的模块。

也就是说使用export命令定义了模块的对外接口以后，其他JS文件就可以通过import命令加载这个模块（文件）