javascript - 如何在 Flask 项目的 VSCode 中调试 JavaScript？

Question

我对这个未回答的 one 有类似的问题.我还不能对上述问题发表评论。
是否有可能，如果可以，如何从 VSCode 中调试 Flask 应用程序的 JS 组件？
我有以下调试配置:

"version": "0.2.0",
"configurations": [
    {
        "name": "Python: Flask - Dev",
        "type": "python",
        "request": "launch",
        "module": "flask",
        "env": {
            "PIPENV_VENV_IN_PROJECT":"1",
            "FLASK_APP":"run.py",
            "FLASK_ENV":"development",
            "FLASK_DEBUG":"1",
            "TEMPLATES_AUTO_RELOAD" : "1"
            
        },
        "args": [
            "run"
        ],
        "jinja": true
    },
    {
        "name": "Python: Flask - initDB",
        "type": "python",
        "request": "launch",
        "module": "flask",
        "env": {
            "PIPENV_VENV_IN_PROJECT": "1",
            "FLASK_APP": "run.py",
            "FLASK_ENV": "development",
            "FLASK_DEBUG": "1",
        },
        "args": [
            "run",
            "--no-reload" // Use for initial dev DB deploy
        ],
        "jinja": true
    }
]

据我所知，可以根据 here 自己的配置使用 Firefox 开发者版的远程调试功能。 .
关于如何组合这些配置的任何想法？或者也许完全可以解决这个问题？

Answer 1

我知道这已经晚了，但我想我会把它留给其他人。
对我来说，这是正确设置“webRoot”属性的问题。
这是我的配置

    {
        "type": "pwa-chrome",
        "request": "launch",
        "name": "Launch Chrome",
        "url": "http://localhost:5001/",
        "webRoot": "${workspaceFolder}/wserver",
    }

“webRoot”应该指向服务器加载的根目录。打开您尝试调试的页面/应用程序，并在开发人员工具中的 Sources 选项卡中查看根 Web 目录。
鉴于 Sources 选项卡中的树如下所示； “webRoot”应该指向(在我的例子中)静态文件夹的本地父目录。在我的情况下“wserver”
本地目录路径: FlaskApp/wserver/static/scripts/myscript.js DevTools 源树:

> localhost:5001
  > static
    > scripts
      > myscript.js

从最新版本的 vscode 开始，您不需要安装任何额外的扩展。