webpack如何愉快的进行开发和测试？

Question

初步接触webpack发现它是个很好的打包工具却不是一个很好的开发测试工具。

比如说开发一个库，主目录为src，有十几个小的模块组成，入口文件为src/index.js ，在webpack-dev-server下如果我只做开发和测试来用，直接在html文件中引入<script src="./src/index.js"> 会提示index.js里面的require未定义，只有引用用webpack.config.js里面定义的output的bundle.js才能正确require到其他依赖模块。

我的问题是：想用webpack的require就只能引用打包文件bundle.js而不能直接引用入口文件src/index.js，感觉这样还不如用requirejs来开发呢，而且用requirejs直接引用入口文件在浏览器NetWork就可以很方便的断点调试各个小模块。

可能webpack能满足我的开发需求，只是我不知道如何配置而已，希望大神们能指点下。

Answer 1

这在webpack中是个问题, 而且不太好避免.

我在使用webpack之前就在这个问题上纠结了很久. 所以很长时间都没有打算使用webpack.

后来, 在换到webpack上之后, 自己搞了一个小的module-loader. 可以看这里 http://isay.me/2016/03/angular-used-project-from-requirejs-to-webpack-5.html

如果直接看这篇不是很了解的话, 可以看以前的那几篇, 看过后应该就了解了.

最近, 我发现可以使用System.js 进行加载. 所以题主也可以看一下

Answer 2

开启 devtool: "source-map"，详情见：http://webpack.github.io/docs/configurat...

Answer 3

https://github.com/ampedandwired/html-webpack-plugin

自动插入bundle