Flutterというフレームワークを使うと、iOS、android両方で動作するアプリケーション（ネイティブアプリ）が作れます。
さらにさらに、Webブラウザーでも動作する優れものなんです。
今回は、Webブラウザーで動作させるための手順(MacOS)を説明します。
環境
Mac OS Big Sur 11.2.2
Flutter 1.26.0
Dart 2.12.0
このページでできるようになること
Flutterの初期アプリケーションをChromeで起動できるようにする。
手順
１、Channelをbetaに切り替える。
現在のChannelを確認するには、下記のコマンドを実行しchannelのあとが何かを確認します。
Flutter --version
Channelには
-
- stable
- beta
- dev
- master
が存在し、それぞれ機能に違いがあります。
参考：https://flutter.dev/docs/development/tools/sdk/releases
Channelをbetaに切り替えるコマンドは下記です。flutter channel beta
エラー発生
git: error: Your local changes to the following files would be overwritten by checkout:
git: packages/flutter/lib/src/material/dropdown.dart
git: Please commit your changes or stash them before you switch branches.
git: Aborting
Switching channels failed with error code 1.コミットしていないものがあると発生するようですが、特にコミットしていないものもなく解決にかなり時間を要しましたが、
結果的には下記のファイルを一旦コメントアウトして再度実行すると新しくdropdown.dartが作成されてうまくbetaに切り替えできました。
packages/flutter/lib/src/material/dropdown.dart
２、SDKの最新化
flutter upgrade
3、Webブラウザを使用可能にする
flutter config --enable-web
これによりChromeが使用可能になります。
確認コマンド
flutter devices
４、Webサポート有効化
flutter create --org package_name .
５、Chromeで実行
flutter run -d chrome無事、Webブラウザで起動できました。
