如何让debugging器使用反应入门工具包来识别webstorm 10中的源代码映射
我使用webstorm的预定义的项目模板在webstorm中创build了一个示例反应入门工具包项目，并试图在debugging模式下设置断点。
我首先使用npm run build项目，然后设置debuggingconfiguration来运行build/server.js 。
但是，它不会识别原始源文件中的任何断点，并且似乎忽略了源映射。 我怎样才能让它识别源代码，并允许我在源文件中设置断点以及进入源文件。
这个问题的反应入门套件回购： https ： //github.com/kriasoft/react-starter-kit/issues/121，但我看不出是什么决议，不像评论者，我不能甚至让它进入源文件…它只是留在生成的js文件。
那么… WebStorm 10不支持由Webpack生成的源代码。 WebStorm 11中部分支持客户端应用程序（请参阅http://blog.jetbrains.com/webstorm/2015/09/debugging-webpack-applications-in-webstorm/ ），但不支持Node.js. 所以，你不能在WebStorm 11中debuggingserver.js，但你可以debugging客户端。 为此，请尝试以下操作：
在src / config.js中更改appConfig ，如下所示：
const appConfig = merge({}, config, { entry: [ ...(WATCH ? ['webpack-hot-middleware/client'] : []), './src/app.js', ], output: { path: path.join(__dirname, '../build/public'), filename: 'app.js', }, devtool: 'source-map', module: { loaders: [ WATCH ? { ...JS_LOADER, query: { // Wraps all React components into arbitrary transforms // https://github.com/gaearon/babel-plugin-react-transform plugins: ['react-transform'], extra: { 'react-transform': { transforms: [ { transform: 'react-transform-hmr', imports: ['react'], locals: ['module'], }, { transform: 'react-transform-catch-errors', imports: ['react', 'redbox-react'], }, ], }, }, }, } : JS_LOADER, ...config.module.loaders, { test: /\.css$/, loader: 'style-loader/useable!css-loader!postcss-loader', }, ], }, });
设置javascriptdebugging运行configuration：
URL： http：// localhost：5000远程URL：将项目根文件夹映射到' webpack:///path/to/react-starter-kit '，就像' webpack:///C:/WebstormProjects/react-starter-kit '地图生成build/public到http://localhost:5000
这并不完美，但一般工作 – 断点在src / routes.js，src / app.js被击中