在开发过程中，开发程序只是第一步，调试才是最重要的，上一节讲了如何在webstorm中进行调试js内容，但是对于进行React进行jsx语法开发时，又是如何调试呢。
对于webpack.config.js配置，这里也不做过多介绍，网上有很多内容，其中一个很重要的就是source map。
什么是Source map
简单说，Source map就是一个信息文件，里面储存着位置信息。也就是说，转换后的代码的每一个位置，所对应的转换前的位置。
JS发布后通常会经过压缩和混淆，所有代码被压缩成一行代码，如果发生错误，无法定位错误，SourceMap因此而生。说起SourceMap，不得不说说uglifyjs，uglifyjs是nodejs下一款优秀的JS压缩优化工具，支持SourceMap的生成。
更多可以参考：
但是自己在webpack.config.js中添加了如下配置：
devtool: 'eval-source-map',
而且在dish的目录下面有：
|
|
文件也有对应关系，但是在chrome中就是看多对应的jsx文件，最后经过公司前端一哥的帮忙，发现如果在webpack中将Debugger中的如下内容打开，就可以看到js对应的jsx文件，断点什么的，就可以飞起来了。
说明source map生效，可以在jsx里面打断点进行调试了。
