然后使用如下方式导入：
import sayHello, { sayGoodbye } from './lib'; sayHello(); // => Hello sayGoodbye(); // => Goodbye
导出一切你想导出的内容：
// lib.js // 导出默认函数 export default function sayHello(){ console.log('Hello'); } // 导出非默认函数 export function sayGoodbye(){ console.log('Goodbye'); } // 导出简单值 export const apiUrl = '...'; // 导出对象 export const settings = { debug: true }
遗憾的是，不是所有的浏览器都支持了原生的模块语法。不过我们在代码中使用原生的模块语法，然后借助babel等转译工具将ES6模块语法转译成ES5所支持的AMD或CommonJS等模块语法。
模块加载器
模块加载器负责解析和加载以特定模块语法定义的模块。模块加载器在运行时执行：
- 首先在浏览器中加载模块加载器
- 告诉模块加载器应用的js入口文件
- 加载器去下载并解析js入口文件
- 加载器按需下载所有的js文件
打开浏览器的调试面板，你会看到加载器按需加载的js文件。
以下是两个常见的模块加载器：
- RequireJS：AMD模块加载器
- SystemJS：CommonJS、AMD、UMD以及System.register 模块加载器
模块打包器
打包器可以替换加载器。不过与加载器不同，打包器是在构建时运行：
- 使用打包器生成一个js文件（例如app.js）
- 在浏览器中加载该文件
如果你在浏览器的调试工具的网络面板中，只会看到浏览器只加载了一个文件。浏览器中不需要模块加载器。所有的代码都被打包在了一个js文件中。
在按需加载的场景下，打包器通常也会提供模块加载器。以按需请求对应的js文件。
列举几个常见打包器：
- webpack
- rollup
- browserify
总结
为了更好地理解现代JS开发环境中的各种工具，理解模块、模块格式、模块加载器和模块打包器之间的区别很重要。
模块是可复用的代码片段，它封装了实现细节，并对外暴露一个公开API，以便其他代码加载使用。
模块格式是用来定义模块的语法。很早之前就已经出现了各种模块格式，如AMD，CommonJS，UMD和System.register。从ES6开始原生提供了模块定义语法。
模块加载器在运行时解释并加载以特定模块格式编写的模块，常见的加载器有RequireJS和SystemJS。
模块打包器可以替代模块加载器。它在构建时生成一个 包含所有代码的JS包。常见的打包器有webpack、rollup和browserify。
好啦，读到这里相信你已经对现代JS开发的知识有了更好地理解了。
