webpack最简单的入门教程里bundle.js之运行单步调试的原理解析

读这篇文章的朋友，请确保对webpack有最基础的认识。

您可以阅读我前一篇文章：Webpack 10分钟入门 来在本地运行一个Webpack的hello world项目。https://www.toutiao.com/i6612879647568822788/

我这里可以在回顾一下这个web pack的hello world项目。

用webpack打包之后，项目文件夹里包含了这些资源：

index.html的源代码很简单，就包含了一个webpack打包后生成的bundle.js文件：

那么运行时，Hello，Jerry的字符串是如何通过bundle.js打印出来的呢？

这就是本文要阐述的内容。我们可以从bundle.js第一行设置断点，然后开始调试：

把我们web工程里定义的两个module注入到__webpack_require__.m里：