无法将 Chrome Live Edit 与 Webpack 源地图一起使用
Cannot use Chrome Live Edit with Webpack source maps
我有一个 webpack 4 配置，可以为我的应用 JavaScript 生成源映射。在 Chrome 中调试我的应用程序时，源映射被加载，因此我可以看到我的统一代码。我将在函数中设置一个断点，然后在源选项卡中对代码进行编辑。我按 CMD+S 保存我的编辑。
通常，我希望 Chrome 在处理我的编辑时稍微思考一下，然后我可以继续调试我的代码更改会话。
但这并没有发生。我在源选项卡中的文件旁边看到一个黄色的小图标，上面写着 "Changes to this file were not saved to the filesystem"。调试会话继续进行，我的代码没有更改。
我在我的 webpack 配置中为 devtools 选项尝试了不同的选项，例如 cheap-module-source-map 和 cheap-module-eval-source-map。
有什么建议吗？谢谢！
我有一些东西在工作！
我最终在 reddit 上发布了同样的问题并得到了一些帮助。
https://www.reddit.com/r/learnjavascript/comments/a98gh1/cannot_use_chrome_live_edit_with_webpack_source/
You need to add your project's directory to save changes in the
source.
Here are the steps:
Open dev tools
Click on the 3 vertical dots on the far-right beside X which brings up
a menu. Click on Settings
Click on Workspace
Add your Project's directory
Refresh the page, and you should be able to save your changes now.
Hope this helps.
奇怪的是，我能够从工作区中删除我的项目目录，并且仍然能够对我的源映射进行实时编辑！
我有一个 webpack 4 配置，可以为我的应用 JavaScript 生成源映射。在 Chrome 中调试我的应用程序时，源映射被加载，因此我可以看到我的统一代码。我将在函数中设置一个断点，然后在源选项卡中对代码进行编辑。我按 CMD+S 保存我的编辑。
通常，我希望 Chrome 在处理我的编辑时稍微思考一下，然后我可以继续调试我的代码更改会话。
但这并没有发生。我在源选项卡中的文件旁边看到一个黄色的小图标，上面写着 "Changes to this file were not saved to the filesystem"。调试会话继续进行，我的代码没有更改。
我在我的 webpack 配置中为 devtools 选项尝试了不同的选项，例如 cheap-module-source-map 和 cheap-module-eval-source-map。
有什么建议吗？谢谢！
我有一些东西在工作！
我最终在 reddit 上发布了同样的问题并得到了一些帮助。 https://www.reddit.com/r/learnjavascript/comments/a98gh1/cannot_use_chrome_live_edit_with_webpack_source/
You need to add your project's directory to save changes in the source.
Here are the steps:
Open dev tools
Click on the 3 vertical dots on the far-right beside X which brings up a menu. Click on Settings
Click on Workspace
Add your Project's directory
Refresh the page, and you should be able to save your changes now.
Hope this helps.
奇怪的是，我能够从工作区中删除我的项目目录，并且仍然能够对我的源映射进行实时编辑！