Flutter Project in VSCode

Tiempo de lectura: 3 minutos

Reading Time: 4 minutes

Today I’m going to show you how to open a Flutter project in VSCode to work in this environment.

First, let’s install the Flutter SDK on our PC:

  • Next, extract the flutter folder to the directory where you want to install it (in my case C:/flutter):
  • Once extracted, we need to create an environment variable to be able to run flutter from the terminal. To do this, go to the start search bar and type env.
  • Open Edit the system environment variables.
  • Click on Environment Variables…
  • Search for the Path variable, if it doesn’t exist, click on New… and create it.
  • In my case, it already exists because the Java directory is added:
  • If it exists, edit it and click New:
  • Now, add the path \flutter\bin. In my case, it is C:\flutter\bin
  • Click OK in all windows.
  • Now open CMD or Windows console and test if it works by typing flutter doctor.
flutter doctor

If it works, you will see this:

Check for any errors and execute what it indicates:

In my case, I need to install this: “path/to/sdkmanager –install “cmdline-tools;latest””. To execute it, we need to find the Android SDK path. If we don’t have it, we’ll need to install the Android SDK (https://developer.android.com/studio)

In my case, the path is: C:\Users\ismae\AppData\Local\Android\Sdk\tools\bin\sdkmanager.bat. To find the path, it is: C:\Users\{username}\AppData\Local\Android\Sdk\tools\bin\sdkmanager.bat

Execute the command:

C:\Users\ismae\AppData\Local\Android\Sdk\tools\bin\sdkmanager.bat --install "cmdline-tools;latest"

If this option doesn’t work, you caninstall the Command-line Tools through the following steps:

  • Open Android Studio and go to Tools – SDK Manager – SDK Tools – Android SDK Command-line Tools – Install

Open SDK Tools

And install the Command line Tools

Click Apply

Once installed, click Finish and OK

Now, run Flutter Doctor again to check if there are any errors:

flutter doctor

Now you can execute Flutter commands:

  • To test the project: flutter run
flutter run

If you don’t have a connected device with USB debugging enabled (https://devcodelight.com/habilitar-depuracion-usb-opciones-para-desarrollador-en-tu-dispositivo-android/), you will be prompted to run it on the web:

It may take some time as the project is being compiled.

Other useful commands:

  • flutter upgrade (update Flutter)

You can also run commands from the VS Code command palette

If you type “Flutter” in the command palette, the following options will appear:

Leave a Comment