Flutter Multi-modules Support

The article originally published at http://limcheekin.blogspot.com.

I wrote this article to inform Flutter developers for a lesser known feature of Flutter: Multi-modules support in a Flutter project. Thanks for inspiration from an article A Flutter BLoC + Clean Architecture journey to release the #1st Idean Flutter app published on Medium.com. It mentioned about “Dart modules”, I not sure whether we are referring to the same thing here.

After gone through the article above, I perform a google search for Flutter module and I found many articles and videos on how to create modular Flutter project, or how to structure Flutter code in modular way, and a library known as flutter_modular. But I’m looking for “real” modules that supported by Flutter and IDEs to define a physical boundary among modules, not a logical one defined by developers. It is an “aha!” moment, out of no way I am thinking of typing flutter create -help command in my terminal window. From the list of options, I found the following option like what I am looking for.

Then, I proceed to flutter.dev website to find out more information about the -t option, not much information found besides a description similar to the above. Hence, I decided to create a Flutter project to test it out. In the flutter project directory, I’m creating two modules such as nested_list and tab_buttons using the following command:

flutter create -t module <module_name>

The following is directory structure of the Flutter project, you can see that the nested_list and tab_buttons module is outside the lib directory (All Flutter code need to be located in the lib directory normally).

The following is the advantages of the “real” Flutter module besides modular structure:

• It has it’s own pubspec.yaml file, you can manage assets, dependencies and other stuff on module-basis.
• It can have it main.dart, you can run the code of a module independent from project and other modules.
• It can have it own test directory, you can write tests to test code of the module.
• A Flutter project can have mix of non-null safety and null safety packages which segregated by modules.
• You can start null safety migration module by module without blocking the release cycle. Flutter Widgets Explorer will adopt this approach.

Once the module is ready, you can link the module to the project by specify the following dependencies configuration in the pubspec.yaml file:

The Flutter project is working in my mobile phone and Google Chrome with the following command:

flutter run -d chrome

Please check out the following github repo and test it out yourself:

https://github.com/limcheekin/flutter-modules

Thanks for reading, I hope the write ups is helpful to you, hear from you soon! :)