FlutterをVSCodeから使う

篠原 隆司

Flutter のエディタとしてAndroid Studio を使っても良いのですが、Visual Studio Code のほうが慣れている場合も多いかと思います。

ここでは Visual Studio Code で開発を行う準備を進めていきます。

VSCode をインストール

https://code.visualstudio.com/

公式サイトからダウンロードしてインストール
特に考えることなく進んで行けるかと思います。

拡張機能をインストール

VSCodeのインストールが出来たら、VSCodeの拡張機能をインストールします。

VSCodeを起動したら左のボタンから拡張機能のアイコンをクリックします。

検索欄に「flutter」を入れ、検索結果にでてきた「Flutter」の「インストール」ボタンをクリック

しばらく待ちます。

表示が切り替わればOKです。

Windows10 向けの準備

Windows10にFulutterをインストールする手順のとおり行われている場合は、「パスを通す」のところで「パスを通さない」ことを選択されているかと思います。

このままでも VSCode でコーディングを行うことはできますが、構文解析など一部の機能が使えません。

そこでVSCodeを起動するときはパスが通った状態にします。

Windows10にFulutterをインストールする手順で次のフォルダにインストールされた続きで行います。

D:\apps\flutter_windows_3.3.10-stable

上図のように「vscode.bat」という名前で作成します。

ファイルの中には次のように記述します。

@ECHO OFF
CALL .\call\init.bat
code
pause

「vscode.bat」をダブルクリックすると、PATHが通った状態でVSCodeが起動します。