Using Flutter in VSCode (installation and setup)

Flutter can also be used in Visual Studio Code (VSCode).

(What the hell ... VSCode doesn't seem to have anything wrong.)

 

1. Download Flutter SDK

Download Flutter SDK for your OS from the link below and unzip it to a suitable location.

[https://flutter.dev/docs/get-started/install] (https://flutter.dev/docs/get-started/install)

 

 

 

 

In my case, I unzipped it to the location below. E: \Program Files\flutter

1-1. Flutter environment variable setting

Now you can specify the path (PATH) in the system environment variable so that you can run this flutter from anywhere.

 

Click Start menu> System (Y)

When the "System" window appears, click "System Information"

 

When the "System Information" window appears, click "Advanced System Settings"

Wait here!

The shortcut keys of the system information window are "Windows key" and "Pause" key.

 

 

When the "Advanced System Properties" window appears, click "Environment Variables".

 

When the "Environment Variables" window appears, select Path and click "Edit (E)".

When the "Edit environment variable" window appears, click "New (N)" and specify the full path of the Flutter you installed and the bin folder as a subfolder.

For example, if you installed it in "E:\Program Files\flutter"

It is to specify "E:\Program Files \flutter" and "E: \ Program Files\flutter\bin".

2. Install VSCode

If you don't have VSCode (Visual Studio Code) yet, download and install it from the link below

[https://code.visualstudio.com/] (https://code.visualstudio.com/)

 

3.Install Android Studio

If you don't have Android Studio, download and install it from the link below.

[https://developer.android.com/studio] (https://developer.android.com/studio)

4. Install Flutter Extensions (Plugin)

First, run VSCode.

 

In VSCode, select the Extensions Icon shown above or press "ctrl + shift + x" to move.

 

 

When the Extensions screen appears as above, search for flutter in the search box and install it.

It is said that the "Dart" plugin, the language used for Flutter, is automatically installed when this is installed.

5. Run Flutter Doctor

Flutter is a command that calls the doctor (?), Which checks whether the settings have been properly set to use Flutter to support the command called Flutter Doctor.

 

 

In the menu window, press View> Command Palette ... or Ctrl + Shift + P to launch the Command Palette.

 

 

When the command palette appears, search for "flutter".

 

 

There are several types of commands as shown above. Run Run Flutter Doctor here.

 

 

If you cannot find the path as above, please check "1-1. Flutter environment variable setting" again.

 

 

The screen above is the screen that Flutter doctor is running.

 

 

 

When the test is complete, the result is reported.

"Doctor found issues in 2 categores." It is said that Doc Wong found two improvements.

Some items have a check mark and an exclamation mark.

1. Flutter: OK

2. Android toolchain: I couldn't find the NDK, but this is an optional pass!

   At the end, there is a warning "Some Android licenses not accepted."

To solve this, you should run "flutter doctor --android-licenses".

3. Android Studio: OK

4. VS code: OK

5. Connected device: This is a pass because you haven't connected anything!

Then I think you only need to solve item 2.

 

 

 

From the menu, click View-> Terminal or Ctrl + `to launch the terminal.

 

Then run the command "flutter doctor --android-licenses".

 

 

I'm constantly asking if you agree, but ... press y unconditionally.

 

Then you will see a message that you have agreed to all licenses.

Now let's run Doctor again.

 

With this, all preparations are done. Now you can create and debug your project in VSCode.

 

Reference

[https://flutter.dev/docs/get-started/editor?tab=vscode] (https://flutter.dev/docs/get-started/editor?tab=vscode)