Zenn
💡

Riverpod で Bad state: No ProviderScope found エラーに困った時のたったひとつのcoolな答え

2021/02/08に公開
Flutter
tech

TL;DR

  • main.dart など root で ProviderScope() するのを忘れてるぞ多分

Riverpod を使ったときに Bad state: No ProviderScope found と出てナニモウゴカナイ

Riverpod を使ったコードを書いて
さぁいざ動かしてみるかと flutter run したときに

えぇ……

コンソールにはこんなエラーが。

flutter: ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
flutter: The following StateError was thrown building RiverpodInstructionPage:
flutter: Bad state: No ProviderScope found
flutter:
flutter: The relevant error-causing widget was:
flutter:   RiverpodInstructionPage file: .../lib/main.dart:19:13
flutter:
flutter: When the exception was thrown, this was the stack:
...

なんだこれ!?

となる前に、落ち着いて、 main.dart を確認しましょう。

ProviderScope widget で wrap するのを忘れてないか？

ｒiverpod.dev の Usage example: Hello world にも
こう書かれていますね。

void main() {
  runApp(
    // For widgets to be able to read providers, we need to wrap the entire
    // application in a "ProviderScope" widget.
    // This is where the state of our providers will be stored.
    ProviderScope(
      child: MyApp(),
    ),
  );
}

そう、ProviderScope widget で wrap する必要がありました。
今回はこれを忘れていました……。追記して、解消。

まとめ

ProviderScope widget で wrap するのを忘れないようにしよう。
何度めかの開発で、すっかり頭から抜け落ちていたのでした。

"Bad state: No ProviderScope found" で Google 検索しまくったものの
なぜか情報がなかったので書きました。
以上

Discussion