FlutterをVSCodeから使う

2023.01.13 2023.01.19 篠原隆司

アフィリエイト広告を利用しています

このページの内容が役に立ったら X (旧twitter) でフォローして頂けると励みになります
挨拶や報告は無しで大丈夫です

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

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

VSCode をインストール

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

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

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

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

しばらく待ちます。

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

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が起動します。