Why does AutoRoute code generator create a _$$AppRouter class instead of AppRouter class

Issue

When trying to use the auto_route package on Flutter, the code generator created a different result than expected. The annotation for the code generation is quite straight forward:

import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';

import '../features/sign_in/sign_in_page.dart';

part 'router.gr.dart';

@MaterialAutoRouter(
  routes: <AutoRoute>[AutoRoute(page: SignInPage, initial: true)],
)
class $AppRouter {}

And this should generate an AppRouter class that can then be used in th code:

import '../routes/router.dart';

class AppWidget extends StatelessWidget {
  AppWidget({Key? key}) : super(key: key);

  //Instantiate the AppRouter
  final AppRouter _appRouter = AppRouter();

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return 
      //use _appRouter
      //All the code...

    
  }
}

However this flags an error, saying that the AppRouter class is undefined, and that the import is not used.

So I thought the generated code could be the problem:

// **************************************************************************
// AutoRouteGenerator
// **************************************************************************

// GENERATED CODE - DO NOT MODIFY BY HAND

// **************************************************************************
// AutoRouteGenerator
// **************************************************************************
//
// ignore_for_file: type=lint

part of 'router.dart';

class _$$AppRouter extends RootStackRouter {
  _$$AppRouter([GlobalKey<NavigatorState>? navigatorKey]) : super(navigatorKey);

  @override
  final Map<String, PageFactory> pagesMap = {
    SignInPageRoute.name: (routeData) {
      return MaterialPageX<dynamic>(routeData: routeData, child: SignInPage());
    }
  };

  @override
  List<RouteConfig> get routes =>
      [RouteConfig(SignInPageRoute.name, path: '/')];
}

/// generated route for
/// [SignInPage]
class SignInPageRoute extends PageRouteInfo<void> {
  const SignInPageRoute() : super(SignInPageRoute.name, path: '/');

  static const String name = 'SignInPageRoute';
}

Now it seems that the grammar for the class declaration of ‘_$$AppRouter is unusual’, as I’d expect it to generate a simple ‘AppRouter’ class.

I tried to change the build_runner version (currently ^2.1.8), change the auto_route version (^3.2.4) to see if it could change anything, but to no avail.

Any help on this issue would be most welcomed.

Solution

This the excerpt from the documentation:

Using part builder ( New in version 3.0.0+)

To generate a part-of file instead of a stand alone AppRouter class,
simply add a Part Directive to your AppRouter and extend the generated
private router.

part 'app_router.gr.dart'  
  
@MaterialAutoRouter(        
  replaceInRouteName: 'Page,Route',        
  routes: <AutoRoute>[        
    AutoRoute(page: BookListPage, initial: true),        
    AutoRoute(page: BookDetailsPage),        
  ],        
)        
// extend the generated private router  
class AppRouter extends _$AppRouter{}

Meaning, this is the part that is missing in your code: class AppRouter extends _$AppRouter{}.

Answered By – mkobuolys

Answer Checked By – Mildred Charles (FlutterFixes Admin)