在上一篇文章 Webpack模块解析构建流程 中，简单介绍了 Webpack 模块编译的整个流程，这一篇给大家讲讲我们写的 demo，或是项目中，我们有哪些方式可以调试 Webpack。原文发布在我的 GitHub，欢迎 star 收藏。

在开始编译流程之前，webpack 会处理用户配置，首先进行校验，通过后与默认配置合并或者是调用相应函数进行处理，输出最终的 options。之后实例化 Compiler，并传入 options，并为注册的 plugins 注入 compiler 实例。如果配置了 watch 选项，则添加监听，在资源变化的时候会重新进行编译流程；否则直接进入编译流程：

在 babel7 中，已经废弃了之前的阶段性提案，现在统一使用 @babel/preset-env。所以呢，这里倒是省去了一些麻烦。在 webpack 配置中 preset-env 配合 babel-loader 就可以转换 ES2015+ 语法了。同时，官方建议我们使用 targets 设定目标浏览器决定需要兼容的功能。举个例子：

在开始回退之前，先说几句。回退之后还是有后悔药可吃的，如果你要舍弃的这些 commit 内容很多很重要，也可以先备份一下。最后会有提这个“后悔药”。