面试大纲：02开发环境

开发环境 - babel

node环境下 npm init

npm i babel-core babel-preset-env babel-preset-lastest -D

创建 .babelrc 文件

npm i babel-cli -g

---

// index.js
[1,2,3].map(v => v.find(1))

babel ./index.js

开发环境 - webpack

npm i webpack babel-loader -D

配置 webpack.config.js

配置 package.json 中的 scripts

运行 npm start

开发环境 - rollup

npm i rollup rollup-plugin-node-resolve rollup-plugin-babel babel-plugin-external-helpers babel-preset-lastest --save-dev

配置 .babelrc

配置 rollup.config.js

---

Rollup 与 webpack的区别

特性：

1. webpack 拆分代码， 按需加载；
2. Rollup 所有资源放在同一个地方，一次性加载，利用 tree-shake 特性来剔除项目中未使用的代码，减少冗余，但是webpack2已经逐渐支持tree-shake

资源：

webpack 相对来说拥有更大的社区支持，资源更加齐全，文档更加完整，有更完整的插件库，如热更新及web-server等。

结论：

对于应用使用 webpack，对于类库使用 Rollup

如果你需要代码拆分(Code Splitting)，或者你有很多静态资源需要处理，再或者你构建的项目需要引入很多CommonJS模块的依赖，那么 webpack 是个很不错的选择。

如果您的代码库是基于 ES2015 模块的，而且希望你写的代码能够被其他人直接使用，你需要的打包工具可能是 Rollup 。