How to Specify a Port Number While Running Flutter Web??

3 min read
How to Specify a Port Number While Running Flutter Web
How to Specify a Port Number While Running Flutter Web

When users run a flutter web application with a command line we need to provide a random port number on which port the flutter web application runs. So in today’s article, we will go through how to specify a port number in Running Flutter Web.

How to Specify a Port Number In Running Flutter Web??

flutter_tools source code will have a code snippet like the below:

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

The above solution works fine if you are like using a command line. But if you are using VSCode by CTRL+F5 that won’t work. So to make vscode CTRL+F5 run in chrome or web-server go to your project root directory create .vscode directory and inside that folder add launch.json file.

Now if you want to run in web server add these lines in your launch.json

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

And if you want to launch in chrome device change argument web-server to chrome i.e.

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

Now run CTRL+F5

To do this for Android Studio, just add the additional parameters to the run configuration. So in the Additional arguments, add –web-port=49430

port number in flutter application
port number in flutter application

You can run flutter web on any chromium based browser

Chrome     |    Edge

Use anyone to launch a flutter web application with a custom port

flutter run -d chrome --web-port 5555

flutter run -d edge --web-port 5555

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

Conclusion:

Thank you for reading!! Hope you have learned the best of it 馃檪

In this article, we have been through how to specify a port number while running flutter web.

Keep聽Learning聽!!! Keep聽Fluttering聽!!!

Do let us know in the comments if you are still confused in flutter!!

FlutterAgency.com聽is our portal Platform dedicated to Flutter Technology and聽Flutter Developers. The portal is full of cool resources from Flutter like聽Flutter Widget聽Guide,聽Flutter Projects,聽Code libs聽and etc.

FlutterAgency.com聽is one of the most popular online portals dedicated to聽Flutter Technology聽and daily thousands of unique visitors come to this portal to enhance their knowledge of聽Flutter.

Leave a Reply