Vue 中 export及export default的区别

  相信很多人都在vue使用过export、export default、import，然而它们到底有什么区别呢？

  在ES6中，export与export default均可用于导出常量、函数、文件、模块等，你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式，将其导入，以便能够对其进行使用，但在一个文件或模块中，export、import可以有多个，export default仅有一个。

  具体使用：

//demo1.js
export const str = 'hello world'

export function f(a){
  return a+1
}

 对应的导入方式：

//demo2.js
import { str, f } from 'demo1' //也可以分开写两次，导入的时候带花括号

 export default的使用

//demo3.js
export default const str = 'hello world'

对应的导入方式：

//demo4.js
import str from 'demo1' //导入的时候没有花括号

补充

模块通常是指编程语言所提供的代码组织机制，利用此机制可将程序拆解为独立且通用的代码单元。所谓模块化主要是解决代码分割、作用域隔离、模块之间的依赖管理以及发布到生产环境时的自动化打包与处理等多个方面。

模块的优点

1.可维护性。 因为模块是独立的，一个设计良好的模块会让外面的代码对自己的依赖越少越好，这样自己就可以独立去更新和改进。

2.命名空间。 在 JavaScript 里面，如果一个变量在最顶级的函数之外声明，它就直接变成全局可用。因此，常常不小心出现命名冲突的情况。使用模块化开发来封装变量，可以避免污染全局环境。

3.重用代码。 我们有时候会喜欢从之前写过的项目中拷贝代码到新的项目，这没有问题，但是更好的方法是，通过模块引用的方式，来避免重复的代码库。

CommonJS，AMD，CMD

CommonJS是一种规范；
AMD/CMD是从 CommonJS 讨论中诞生的，
RequireJS 遵循 AMD（异步模块定义）规范，
node 遵循 CMD （通用模块定义）规范；
规范的不同，导致了两者 API 不同。

CommonJS是一种规范，其内容有很多种，NodeJS是这种规范的实现。SeaJS是模块加载器，是用CMD规范。

AMD 提前执行：提前异步并行加载  
优点：尽早执行依赖可以尽早发现错误；
缺点：容易产生浪费

CMD 延迟执行：延迟按需加载  
优点：减少资源浪费 

缺点：等待时间长、出错时间延后

例：RequireJS 是一个前端的模块化管理的工具库，遵循AMD规范,通过一个函数来将所有所需要的或者说所依赖的模块实现装载进来，然后返回一个新的函数（模块），我们所有的关于新模块的业务代码都在这个函数内部操作，其内部也可无限制的使用已经加载进来的以来的模块。