Chrome 中使用 Browserify 的代码映射
Code maps with Browserify in Chrome
我只是在试用 browserify，但我无法让它与源地图一起工作。在 package.json 我有：
"build": "browserify --debug myApp.js -o bundle.js"
我 运行 它与 npm run build，它生成一个 bundle.js 文件，底部有这样一行，我假设这是源映射：
//# sourceMappingURL=data:application/json;charset:utf-8;base64,eyJ2ZXJzaW9uIjozLCJz....
当我在 Chrome 中打开我的 index.html 时，它正在运行 - 所有 myApp.js 都被编译成 bundle.js 并且功能齐全。但是在 dev tools/sources 中我只看到编译的 bundle.js。我打开了 'enable Javascript source maps'，并且正在使用 Chrome 45。还有什么我应该做的才能让代码映射正常工作吗？谢谢。
我也试过通过 exorcist 管道来创建一个 bundle.js.map。还是不行。
想通了。 Browserify 运行良好 - //# sourceMappingURL=...
line 是源映射工作所需的全部。但是，要在 Chrome (45) 中显示源映射，您需要在开发者工具面板关闭的情况下加载页面，然后再打开它。如果按该顺序执行操作，您将看到按照源映射正确列出的原始源文件。
但是，如果您在开发人员工具面板已经打开的情况下重新加载页面，您看到的只是编译后的源文件。
我个人认为这是一个错误。
我只是在试用 browserify，但我无法让它与源地图一起工作。在 package.json 我有：
"build": "browserify --debug myApp.js -o bundle.js"
我 运行 它与 npm run build，它生成一个 bundle.js 文件，底部有这样一行，我假设这是源映射：
//# sourceMappingURL=data:application/json;charset:utf-8;base64,eyJ2ZXJzaW9uIjozLCJz....
当我在 Chrome 中打开我的 index.html 时，它正在运行 - 所有 myApp.js 都被编译成 bundle.js 并且功能齐全。但是在 dev tools/sources 中我只看到编译的 bundle.js。我打开了 'enable Javascript source maps'，并且正在使用 Chrome 45。还有什么我应该做的才能让代码映射正常工作吗？谢谢。
我也试过通过 exorcist 管道来创建一个 bundle.js.map。还是不行。
想通了。 Browserify 运行良好 - //# sourceMappingURL=...
line 是源映射工作所需的全部。但是，要在 Chrome (45) 中显示源映射，您需要在开发者工具面板关闭的情况下加载页面，然后再打开它。如果按该顺序执行操作，您将看到按照源映射正确列出的原始源文件。
但是，如果您在开发人员工具面板已经打开的情况下重新加载页面，您看到的只是编译后的源文件。 我个人认为这是一个错误。