Watch your code!
How to enable Dart linting to become a Flutter code ninja
So here I am again writing Flutter articles — thanks so much to all the people who read my last one called ‘The Layer Cake’ and gave me the motivation to write this one. Let’s get started!
Every time you want to learn a new programming language the best thing you can probably do is actually writing code. A lot. And then make mistakes. A lot. In the end that’s how we learn new things. By failing. Over and over again. And that’s perfectly fine.
However, if you want to work together with other people at some point or maybe want to improve the performance and quality of your code, you have to follow some guidelines. In this case those are the guidelines of the Dart programming language. And that’s where the linter comes into play.
What is linting?
A linter or lint refers to tools that analyze source code to flag programming errors, bugs, stylistic errors, and suspicious constructs. The term originates from a Unix utility that examined C language source code.
Even if you don’t know the word ‘lint’ or ‘linting’ chances are quite high that you are already familiar with the tool. In your IDE it usually disguises itself as yellow-ish zig-zag lines under a specific part of your code revealing more info about what is wrong when hovering it with your cursor.
Another place you may know it from would be the Dart Analysis tab which regularly shows you messages about things you could do to improve your code. Imagine the Dart analyzer as an old wise man who tells you how bad your code actually is, e.g. Yoda, Gandalf or Alfred from the Dark Knight — he has probably already ‘written a ton of Dart code and learned a lot about what works well and what doesn’t.’* In the end you can speed up your learning curve by avoiding making the same mistakes and becoming a better developer right from the start.
*took this from the intro of ‘Effective Dart’, an article by the Dart team which lists all the Do’s and Don’ts when writing Dart code. Many of those rules will be automatically covered by the rule-set we are going to set up in the next step but it’s definitely worth a read. Seriously. Go and check it out.
How to enable linting in your project
When you create a new Flutter project and use the IDE of your choice you should already be presented with a default linting configuration which shows you hints for things like an empty else code block or when you call a method without a required parameter.
However, there’s more. The Flutter team has a list of curated Dart lints which is updated every now and then. I highly recommend everyone to use those rules in your own project from the very beginning — otherwise it could become a real pain to see and fix all the warnings in your code when enabled later (these could easily go up to a few thousand). Also, it’s never bad to use the code guidelines of the pros.
You can find the configuration file from the Flutter project right here: https://github.com/flutter/flutter/blob/master/analysis_options.yaml Just drop the file into the root of your project and your IDE should automatically start using the new rules — just check the Dart Analyser tab in your IDE or run flutter analyze to see all code optimisations / warnings in the project. That’s it!
Make it yours
When you have a look at the analysis_options.yaml from the Flutter repo, you notice that there are a some checks commented out. If you are advanced you can also edit the file or create your own where you enable / disable the checks you prefer (since many of them also enforce a specific code style). You can find a list of all available checks with a short description here: http://dart-lang.github.io/linter/lints/.
Feel like you can’t decide? No worries! If you are new to Flutter and / or Dart, the analysis_options.yaml from the Flutter repo should be a good starting point.
Conclusion
It doesn’t matter if you’re a pro or a beginner — if you don’t have a good reason not to use the advanced rule set provided in the Flutter repo or even your own, the first thing after creating a new project should be to drop the analysis_options.yaml into your project root. Happy coding!
PS: If you are into Flutter and like to hear more about the framework, make sure to follow me on Twitter ;-)
