Vue.js Component Style Guide
How to write good and reusable Components in Vue.js
Check this Github out
Due the lack of a good Style Guide for developing Vue.js Components, I decided to create one document that will help those who are entering the Vue.js world.
The purpose was to put together some theory about components, good practices that only those who read the documentation and follow Vue.js on groups like Gitter and Slack know and a pinch of personal experience in a single document and make it available to everyone.
The guide provides a uniform way to structure your Vue.js code, making it:
- easier for developers/team members to understand and find things.
- easier for IDEs to interpret the code and provide assistance.
- easier to (re)use build tools you already use.
- easier to cache and serve bundles of code separately.
I tried to write it as simple as possible. I based it on a document written by De Voorhoede who had the same style guiding goal. The table of content is:
- Module based development
- vue component names
- Keep component expressions simple
- Keep component options primitive
- Harness your component options
- Component structure
- Use component name as style scope
- Document your component API
- Add a component demo
- Lint your component files
You can check it out clicking right here.
Liked it? Hated it? Want to add something?
Please, feel free to create an issue or even forking it and Pull Requesting your changes. It will be a pleasure to have a Vue.js Style Guide with your help.
Thank you Rory Dent !