Featured Flutter Package - Spider

Nearly every application these days have a rich library of assets. These can range from fonts, to audio clips, images, and much more.

One my pet gripes towards the Flutter framework was its ability to assist in the implementation of these assets. Dart as a language does not have any native code generation (yet!), so nearly all assets had to be manually input as relative string paths; meaning any small change would potentially result in runtime errors which are not always caught.

It is because of this that we at inqVine on basically all projects include the Spider package. Many thanks over to Birju Vachhani - you can check out his personal blog over here.

This package is quite straight forward. It uses a Dart script to lookup paths passed in via YAML configuration, and generates a class and tests for all the assets found within. The result are concrete and tested references to all assets within your project.

---

Before:

Widget build(BuildContext context) {
  return Image(image: AssetImage('assets/background.png'));
}

After:

Widget build(BuildContext context) {
  return Image(image: AssetImage(Assets.background));
}

---

So… What do you have to do to use this package?
Its as easy as these three steps:

1. Run - flutter pub global activate spider

2. Run - spider create

3. Edit the supplied spider.yaml file

4. Run - spider build

And that is it. If you really want to up your game, you can add step 1 and 4 to your CI/CD pipeline to make sure all assets are caught. For example in Codemagic or Github Actions, as this will stop people adding assets and them being left out of the compilation, or worse assets missing after being removed from source control.

That’s it for this blog!

Want to see your package featured? Ping us a message and we will check it out!

Ryan