在不创建 Microsoft Edge 新实例的情况下在 VS Code 中调试 Flutter Web 应用程序

Debug Flutter web app in VS Code without creating a Microsoft Edge new instance

一切都已设置并正常工作,但是当我开始使用 Microsoft Edge 在 vs 代码中调试 flutter 时,它会启动一个新实例,这意味着浏览器数据、密码、设置....都已重置,所以我需要输入每次我开始调试或我需要打开两个资源密集型且粘人的浏览器实例时,密码和更改设置。 是否有类似 vs code 的 flutter 配置,可以作为“附加”到现有浏览器实例而不是“启动”新实例?

通常情况下,当您使用启动配置开始调试时,如果 Microsoft Edge 已经 运行,则新实例将不会以远程调试模式启动。

因此,默认情况下,扩展会在临时文件夹中使用单独的用户配置文件启动 Microsoft Edge。使用 userDataDir 设置不同的使用路径,或设置为 false 以使用默认用户配置文件启动。

一个简单的例子:

{
    "configurations": [
        {
            "name": "Launch Microsoft Edge",
            "request": "launch",
            "type": "edge",
            "url": "...\Index.html", // Provide your project's url to finish configuring
            "userDataDir": false // You could also add ${local_app_data}\Edge\Profile, such as C:\Users\<Current-user>\AppData\Local\Microsoft\Edge\Profile
        }
    ]
}

您必须 运行 使用以下命令,

flutter run -d web-server --web-port 8080 --web-hostname 0.0.0.0

然后访问 http://<your-ip> or localhost:8080

这样你就可以在普通浏览器中打开你的flutter web-app,你也可以在网络中的其他设备上打开它(用你的ip) ** 你还应该确保你的端口 (8080) 是开放的。

我没有完美的解决方案,因为这个需要你安装 Dart Debug Extension,但你可以创建一个 launch.json 并粘贴此命令:

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Flutter Web Project",
            "type": "dart",
            "request": "launch",
            "program": "lib/main.dart",
            "args": [
                "-d",
                "web-server"
            ]
        }
    ]
}