This post is outdated.
An official Vue.js style guide is now available on vuejs.org
If you have started Vue.js development recently, or even component-based JS frameworks, you have just landed in a new world. You might be a bit lost, and as most developers, you’d rather get started writing code than reading all the docs.
Now that you have experimented a bit, it is time to write better components : easily re-usable, clean code and respectful of Vue.js best practices.
is a set of recommandations that mixes common best practices and opinionated code style rules to make the Vue.js ecosystem more consistent.
Example 1 : keep expressions simple
This one is easy, and you are probably doing it already. But a reminder doesn’t hurt : Do not write long expressions in templates, use computed properties instead.
Example 2 : make your component’s props API rock-solid
Two things to do here : and .
Keeping options primitive will prevent fellow developers from passing reactive or complex objects to components that might lead to behavior inconsistency.
Making sure every properties have a default fallback function and a type attribute also prevents parent components from passing incorrect values that could lead to potential JS runtime errors.
Many more to see
Check out the and take the most out of it.
Remember that this guide is meant to be complimentary to the official docs. Docs are still the “source of truth”, but following these recommandations will help you and your team (or the open source world, if you share your code) to write code that is better and easier to maintain.