How to create a Flutter Package and publish it on pub.dev

In this article, We will see How We can create Flutter package and publish it on pub.dev.

If you are working with Flutter, You probably have used a third-party package. Why not? Just search for the package you need on pub.dev, add the dependency in pubspec.yaml file (Fun Fact- Full form of yaml is Yaml Ain’t Markup Language), there you go. Why should we rewrite the whole code(logic) which has been already written by other developers? But how to develop these packages and publish it on pub.dev? We will see it in detail:

Prerequisites

Flutter Installed

Basic Knowledge Of Flutter

Type Of Packages

Dart packages

Packages that are written in Dart. They might contain Flutter specific functionality and depend on the Flutter Framework.

Plugin packages

Packages that contain an API written in Dart code combined with one or more platform-specific implementations. Plugin packages can be written for Android (using Kotlin or Java), iOS (using Swift or Objective-C), web (using Dart), macOS (using Dart).

In this article, we will focus on the Dart Package only. Let’s write our own Flutter package. We are creating a package that provides different social sign-in buttons. It will provide the buttons as shown in the below image.

Example App

Step 1: Create a package

If you are using Android Studio, it will directly provide an option to create Flutter Package when you start a new Flutter Project.

Or you can just run this command on command prompt.

flutter create --template=package social_signin_buttons

It will create a new project social_signin_buttons. The project directory contains the following important files:

lib/social_signin_buttons.dart: Dart starter app containing Dart code for the package.

pubspec.yaml: A yaml file containing metadata that specifies the package’s dependencies. Used by the pub tool.

README.md: A starter markdown file that briefly describes the package’s purpose.

LICENSE: A (mostly) empty license text file.

CHANGELOG.md: A (mostly) empty markdown file for tracking version changes to the package.

test/hello_test.dart: The unit tests for the package.

Step 2: Implement The Package

First of all, We need icons of sign-in/OAuth providers so we add the font_awesome_flutter package in pubspec.yaml file for Icons.

pubspec.yaml

Now we will create assets folder in the project directory and paste the images.

-social_signin_buttons
    -assets
        -google_logo.png
        -microsoft_logo.png

Next, we will write an implementation of our package in lib/social_signin_buttons.dart file.

social_signin_buttons.dart

It is a pretty simple code, We are just returning Material Button Widget according to parameters.

Step 3: Add Documentation

Add the description of your package, How to Use it, screenshots, or animated gif, an example in README.md file.

Update the CHANGELOG.md file.

Add the LICENSE in the repository. You can add the license by following these steps.

Add one example flutter project that uses the package. It is optional but I suggest you to add the example.

Add the homepage field as your link of GitHub repository in pubspec.yaml

pubspec.yaml

Step 4: Publish Your Package

First, sign in to pub.dev with your Google Account.

Before publishing, make sure to review the pubspec.yaml, README.md, and CHANGELOG.md files.

Next, run the publish command in dry-run mode to see if everything passes analysis:

flutter pub publish --dry-run

If there is any error solve it else we can publish it to pub.dev. But be sure that you are ready because publishing is forever. we can’t remove the package from there. So if you are ready, run following command:

flutter pub publish

For authentication, one link will be provided, just open in browser and select your google account.

Wait for uploading.

And it’s Done, Hurrah! You have created your own Futter Package.

You can search for your package on the pub.dev site after some time, It will take a few minutes.

Get the full source code here: Social-SignIn-Buttons.

Check out my package on pub.dev: Social-SignIn-Buttons.

Comment If you have any doubts or issues and share it if you liked it.