🙆‍♀️

Flutter と Dart のバージョンをあげる

2023/12/19に公開

この記事は mob Advent Calendar 19日目の記事です。

まだしっかり調べられていないのですが、Flutterプロジェクトにおいて、 iOS の Privacy Manifests の義務化によって、 Flutter 自身やライブラリのアップデートを行わないといけなくなりそうなので、現時点で全体のバージョンを上げておこうと思います。結構バージョンアップを放置してしまっておりました。。

この記事では Flutterやライブラリ全体のバージョンを上げていく流れを説明し、最後には renovate を導入して終了という流れでやっていきます。

fvm で Flutterのバージョン を更新する

執筆時点での fvm releases の結果はこのようになっています。そのため、今回は 3.16.4 を使うようにします。

$ fvm releases 

...
Dec 6 23   │ 3.16.3           
Dec 13 23  │ 3.16.4           
--------------------------------------
Dec 13 23  │ 3.16.4            stable
--------------------------------------
Dec 14 23  │ 3.18.0-0.2.pre   
--------------------------------------
Dec 14 23  │ 3.18.0-0.2.pre    beta
--------------------------------------

fvm use3.16.4 を指定します。

$ fvm use 3.16.4

Flutter 3.16.4 では Dart 3.2.3 を使用しています。 アップデート前は Flutter は 3.3.9 を使用しており、このバージョンでは Dart 2.18.5 を使用しています。 Dart のメジャーバージョンが違うため、 pubspec.yaml を手で更新しておきます。

environment:
+ sdk: '>=3.0.0 <4.0.0'
- sdk: ">=2.18.5 <3.0.0"

ここまできたら、下記コマンドを実行します。

$ fvm flutter clean
$ fvm flutter pub upgrade
$ fvm flutter pub get

Error や Warning が出てくると思うので、手で解消していきます。

最終的にビルドして動作確認して問題ないか確認します。

ライブラリもすべて最新版にする

下記のコマンドを実行すると、使っているライブラリの最新版などのバージョンがわかります。

$ fvm flutter pub outdated

Showing outdated packages.
[*] indicates versions that are not the latest available.

Package Name      Current  Upgradable  Resolvable  Latest  

direct dependencies:
video_player_web  *2.0.14  2.1.2       2.1.2       2.1.2   

dev_dependencies: all up-to-date.
...

上記は video_player_web がアップデート可能で、 2.12.2 まで上げられることがわかります。
これを頼りに手で pubspec.yaml を更新します。更新後、下記コマンドをして pubspec.lock を更新します。

$ fvm flutter clean
$ fvm flutter pub get

また、ビルドして動作確認して問題ないか確認します。

Github Actions で使ってる Flutter のバージョンも忘れずに

たとえば自分は下記の Github Actions を登録しています。

name: Codecov

on: [push]

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
        with:
          token: ${{ secrets.GITHUB_TOKEN }}
      - name: Repository
        id: version
        run: |
          REPOSITORY=$(echo ${{ github.repository }} | sed -e "s#.*/##")
          echo ::set-output name=repository::$REPOSITORY
      - name: Flutter
        uses: subosito/flutter-action@v2
        with:
          flutter-version: "3.16.4"
          channel: "stable"
          cache: true
      - name: Test And Coverage
        working-directory: ./packages/fanclub
        run: |
          flutter --version
          flutter pub get
          flutter test --coverage
      - name: Upload Coverage Report
        working-directory: ./packages/fanclub
        run: |
          bash <(curl -s https://codecov.io/bash) -f "coverage/lcov.info" -t ${{ secrets.CODECOV_TOKEN }}

この部分の flutter-version のアップデートも忘れずに行います。

      - name: Flutter
        uses: subosito/flutter-action@v2
        with:
          flutter-version: "3.16.4"
          channel: "stable"
          cache: true

renovate の導入

まずは、このページを開いて 「Configure」 を押下します。

https://github.com/apps/renovate

Repository access から 「Only select repositories」を選び、導入したいリポジトリを選択して Save を押下します。

そうすると「Configure Renovate」というPRができます。

renovate.json を自分は次のように修正しました。

renovate.json
{
  "extends": ["config:base", "schedule:daily"],
  "enabledManagers": ["pub", "fvm", "regex"],
  "timezone": "Asia/Tokyo",
  "labels": ["dependencies"],
  "baseBranches": ["main"],
  "branchPrefix": "renovate/",
  "rangeStrategy": "replace",
  "rebaseWhen": "conflicted",
  "lockFileMaintenance": {
    "enabled": true
  },
  "ignorePresets": [
    ":dependencyDashboard",
    ":semanticPrefixFixDepsChoreOthers",
    ":prHourlyLimit2"
  ],
  "pub": {
    "fileMatch": ["^packages/.*/pubspec\\.yaml$"],
    "enabled": true
  },
  "fvm": {
    "enabled": true
  },
  "regexManagers": [
    {
      "fileMatch": ["^.github/workflows/.*\\.yaml$"],
      "matchStrings": [
        "flutter-version: \"(?<currentValue>\\d+\\.\\d+\\.\\d+)\""
      ],
      "datasourceTemplate": "flutter-version",
      "depNameTemplate": "flutter"
    }
  ],
  "ignoreDeps": [
    "cloud_firestore",
    "firebase_messaging",
    "firebase_remote_config",
    "firebase_crashlytics",
    "firebase_analytics",
    "firebase_core",
    "firebase_dynamic_links",
    "firebase_messaging"
  ]
}

packages配下に flutter プロジェクトが複数ある構成になっているので下記のようになっています。

  "pub": {
    "fileMatch": ["^packages/.*/pubspec\\.yaml$"],
    "enabled": true
  },

fvm を使っているので、 true にします。

  "fvm": {
    "enabled": true
  },

Github Actions の flutter-version も更新するようにします。

  "regexManagers": [
    {
      "fileMatch": ["^.github/workflows/.*\\.yaml$"],
      "matchStrings": [
        "flutter-version: \"(?<currentValue>\\d+\\.\\d+\\.\\d+)\""
      ],
      "datasourceTemplate": "flutter-version",
      "depNameTemplate": "flutter"
    }
  ],

これで、こまめに上げてけば問題ないはず!

Discussion