运行Flutter Web时如何指定端口号

Question

有什么方法可以始终在相同的指定端口号上启动具有Headless-Server目标的Flutter Web？

今天，通过以下方式运行Web应用程序：

flutter run -d headless-server

提供一个随机的端口号。

Answer 1

要为 Android Studio 执行此操作，只需将其他参数添加到运行配置中即可。所以在 中Additional arguments，添加--web-port=49430

Answer 2

如果您喜欢使用命令行，上述解决方案工作正常。但是，如果您使用的是 VsCode，CTRL+F5那将不起作用。因此，要使 vscodeCTRL+F5在 chrome 或 web-server 中运行，请转到您的项目根目录创建.vscode目录并在该文件夹中添加launch.json文件。

现在，如果您想在 Web 服务器中运行，请在您中添加此行 launch.json

{
 "version": "0.2.0",
 "configurations": [{
        "name": "Flutter",
        "request": "launch",
        "type": "dart",
        "args": ["-d", "web-server","--web-port", "8000"],
    }
]}

如果您想在 chrome 设备中启动，请将参数更改web-server为chomeie

{   
 "version": "0.2.0",
 "configurations": [{
        "name": "Flutter",
        "request": "launch",
        "type": "dart",
        "args": ["-d", "chrome","--web-port", "8000"],
    }
]}

现在运行 CTRL+F5

Answer 3

截至 2020 年 9 月

你可以在任何基于铬的浏览器上运行 flutter web

Chrome     |    Edge     

使用任何一个来启动带有自定义端口的 flutter web 应用程序

flutter run -d chrome --web-port 5555

flutter run -d edge --web-port 5555

flutter run -d web-server --web-port 5555

编辑

与主要问题无关，但如果您遇到下面提到的问题会有所帮助。

最近遇到一个 Flutter Web 应用程序的问题，它没有运行，也没有可见的日志/错误。

我是如何修复它的。

运行flutter build web 它应该打印出错误，修复这些错误，然后尝试通过上述命令运行您的应用程序

Answer 4

我在flutter_tools源代码中找到了答案：

flutter run -d headless-server --web-port=1234

Answer 5

这也很有效——

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

Answer 6

VS Code 的解决方案

1. 前往设置
2. 搜索Dart: Flutter Run Additional Args
3. 进入--web-port=1234
4. 点击Add Item