How to Set Up the Flutter Environment in Visual Studio Code on Windows System

Introduction

Flutter is a popular open-source framework for building cross-platform mobile applications. Here's a guide on how to set up Flutter on your Windows system.

Prerequisites

  • Windows system. (64-bit)
  • Disk Space: 400 MB (excluding IDE/tools).
  • Git for Windows (Optional, but recommended for version control)

Step 1. To install Git on your Windows system, follow these steps (Optional but recommended).

  • Click on the Git link provided: https://git-scm.com/download/win
  • Once you click on the link, you will be directed to the Git for Windows download page.
  • On the download page, choose the "64-bit Git for Windows SetUP" option.
  • Click on the download link to start the download
  • Once the download is complete, locate the downloaded file and run the installer.
  • Follow the on-screen instructions to complete the installation process.

By following these steps, you will successfully install Git on your Windows system.

Download Git

Step 2. Install Flutter SDK

Visit the Flutter official website.

Link: https://docs.flutter.dev/get-started/install/windows

Download the Flutter SDK file and save it on your device (e.g., C:\src\flutter).

Save the downloaded file in a suitable location on your device, such as "C:\src\flutter".

Ex. D:\foldername\flutter.

Note. Avoid installing Flutter on paths containing special characters and spaces.

In my case, I saved the file in C drive that C:\src\flutter.

File folder

Update the path

Update the system environment variables path, open "Edit the system environment variable" option in your system settings.(Press Windows button)

Edit the system environment variables path

Click on the “environment variable” button as follow below screen shot.

System properties

In the "Environment Variables" window, select the "Path" variable and click on the "Edit" button.

Edit path

Copy the below path (which you saved in the flutter file) and update the path in environment variables.

Update the path

Add the path to the Flutter SDK folder (e.g., "C:\src\flutter\bin") to the list of paths and click on and ok.

Edit environment variable

To check if Flutter is installed/not on your Windows system, open the command prompt (press Windows key + R, then type "cmd") and run the command "flutter doctor". This command will display the status of your Flutter installation and any additional steps you may need to take.

Flutter

Some errors showing that is Editors errors. Once you installed Editor that is gone.

Editors errors

Step 3. Install Visual Studio Code: Download and install Visual Studio Code from the official website.

Link : https://code.visualstudio.com/download

Download Windows

Install Flutter and Dart extensions

Open Visual Studio Code, go to the extensions tab and search for "Flutter" and "Dart" extensions.

Install Flutter

Dart extensions

Again, to check if Flutter is installed on your Windows system, open the command prompt (press Windows key + R, then type "cmd") and run the command "flutter doctor". This command will check if Flutter is properly installed and display any issues or errors.

Flutter Doctor

Conclusion

Flutter provides an excellent platform for developers to create high-quality cross-platform mobile applications. By following these step-by-step instructions, you can easily set up the Flutter environment on your Windows system using Visual Code. So, get ready to dive into the world of Flutter and unleash your creativity in building stunning mobile apps!


Similar Articles