DEV Community

Vrushali
Vrushali

Posted on

๐Ÿšจ Common Flutter Mistake: `riverpod` vs `flutter_riverpod`

โ€œWhy isnโ€™t ConsumerWidget working?!โ€

Been there? So was I โ€” and hereโ€™s what I learned ๐Ÿ‘‡


โŒ The Mistake

I added this to my pubspec.yaml:

yaml
dependencies:
  riverpod: ^2.0.0
Enter fullscreen mode Exit fullscreen mode

It installed without error. But suddenly, ConsumerWidget wasnโ€™t available, ref.watch() threw errors, and I couldnโ€™t use ProviderScope.

I thought Riverpod was broken... until I realized my mistake. ๐Ÿ˜…

โœ… The Fix
So, fix your pubspec.yaml like this:

dependencies:
  flutter_riverpod: ^2.5.1
Enter fullscreen mode Exit fullscreen mode

Then import it in your Dart files:
import 'package:flutter_riverpod/flutter_riverpod.dart';

๐Ÿง  Bonus Tip
Don't forget to wrap your app with ProviderScope in main.dart:

void main() {
  runApp(ProviderScope(child: MyApp()));
}
Enter fullscreen mode Exit fullscreen mode

Without this, providers wonโ€™t work โ€” even with the correct package.

๐Ÿงต TL;DR
If you're using Riverpod in Flutter and ConsumerWidget or ref.watch() isn't working:

You likely added riverpod instead of flutter_riverpod

Fix your pubspec.yaml

Save yourself from unnecessary debugging ๐Ÿ˜…

๐Ÿ’ฌ Your Turn
Have you made this mistake before?
Got other Riverpod or Flutter setup tips?

Letโ€™s chat in the comments ๐Ÿ‘‡

Top comments (0)