[Flutter] Getting Started on VSCode

Flutter is a cross-platform app development framework made by Google.

Let's get started flutter on VSCode.

Prerequisite

Xcode has to be installed already.

And, this command should be run in order to use the iOS simulator in VSCode.

$ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
$ sudo xcodebuild -license accept

Installing VSCode

You can download it through the official homepage.

https://code.visualstudio.com/

 

You can also download it through homebrew.

$ brew install --cask visual-studio-code

Installing Flutter SDK

You can download it through the official homepage.

https://docs.flutter.dev/development/tools/sdk/releases?tab=macos

 

You can also download it through homebrew.

$ brew install --cask flutter

Now, you need to add flutter SDK to the PATH environment.

I'm using zsh, so I will add it to the zsh config.

$ code ~/.zshrc

Add this code into the configuration.

export PATH=/usr/local/bin/:$PATH

Apply it.

$ . ~/.zshrc

Setting VSCode for Flutter

Installing an extension for Dart and Flutter.

Creating a New Project on VSCode

Open the palette menu (⌘⇧P).

Select the Flutter: New Project.

Select the Application.

And, choose the location to create a project.

Running an Application

Selecting a target device.

I selected an iOS device, but you can select an android device as well.

Select the menu to run the flutter application.

• Start Debugging (F5)
• Run Without Debugging (⌃F5)

You can config the launch setting.

// .vscode/launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "getting_started_vsc",
      "request": "launch",
      "type": "dart"
    },
    {
      "name": "getting_started_vsc (profile mode)",
      "request": "launch",
      "type": "dart",
      "flutterMode": "profile"
    }
  ]
}

flutterMode can be the debug, profile, and release.

• debug: when you want to use hot reload
• profile: when you want to analyze performance
• release: when you are ready to release

Concluding

Feel free to enjoy flutter with vscode.