DEV Community

May Lau
May Lau

Posted on • Originally published at maylau.hashnode.dev

2 Steps to Make Project Always in Dart Format

Maintaining flutter projects and open source packages, keeping all source in dart format is important to let other collaborators to review your PRs with ease and passing flutter analyse for package. Since most of my projects are on GitHub and GitLab, free monthly GitHub Action and GitLab CI helped me a lot.

1. Local Pre-commit Hook

I have added a pre-commit hook to my flutter project which can ensure the source fits dart format before commit.

  1. open terminal goto .git/hooks and create a file pre-commit.
  2. run chmod +x pre-commit to make the file executable.
  3. update the pre-commit file with following script.
  4. a message will show and block the commit if the commit is not following dart format
#!/bin/sh

DARTFMT_OUTPUT=`dart format lib test | grep "0 changed"`
if [ -n "$DARTFMT_OUTPUT" ]; then
  echo "[pre-commit] All Dart files are formatted."
  echo "[pre-commit] $DARTFMT_OUTPUT"
  exit 0
else  
  echo "[pre-commit] Files are changed, please verify and re-attempt commit"  
  echo "[pre-commit] $DARTFMT_OUTPUT"
  exit 1

fi
Enter fullscreen mode Exit fullscreen mode

2. Test Before Merge PR

Many platform provide custom CI action allow perform test before merging PR. For example, GitHub Action, GitLab CI and CodeMagic are able to conduct the format test. Depending on cost and platform using, no need to implement every platform. This move is to avoid the commits made by web portal causing incorrect format since some situations not every collaborators are developer.

GitHub Action

For project using GitHub, I will add a yaml file to .github/workflows/. For example, this is my .github/workflows/dart-format.yaml which will run once at pull request to avoid merging some reviews directly on web accidentally causing dart format incorrect.

name: Dart-Format

on: [pull_request]

jobs:
  build:
    runs-on: ubuntu-latest

    container:
      image:  google/dart:latest

    steps:
      - uses: actions/checkout@v2

      - name: Print Dart SDK version
        run: dart --version

      - name: Verify formatting
        run: dart format --output=show --set-exit-if-changed .
Enter fullscreen mode Exit fullscreen mode

GitLab CI

Similarly, GitLab also can setup a file declare to do different action on different situation. I will create a .gitlab-ci.yml in the project. The following file will run the dart format checking when I pushed something.

stages:   
    - test

dart-format-test:
   image: cirrusci/flutter
   stage: test
   script:
   - flutter format lib test --set-exit-if-changed
   only:
     - pushes
Enter fullscreen mode Exit fullscreen mode

CodeMagic

I have put the bash script which is the same as the local one to the pre-test part. If the format is not correct, it will soon stop further action and notify me.

code magic pre-test script

Support me if you like the content🍖
ko-fi

Connect🍻
GitHub - MayLau-CbL

Twitter - @MayLauDev

Hashnode - @MayLau

Top comments (0)