From 469148b23184a1dd2d5ce6ceedcce48c2b02a7d1 Mon Sep 17 00:00:00 2001 From: George Tsiolis Date: Thu, 8 Feb 2018 21:06:18 +0200 Subject: [PATCH] Update vue component naming guidelines --- .../unreleased/docs-update-vue-naming-guidelines.yml | 5 +++++ doc/development/fe_guide/style_guide_js.md | 10 +++++----- 2 files changed, 10 insertions(+), 5 deletions(-) create mode 100644 changelogs/unreleased/docs-update-vue-naming-guidelines.yml diff --git a/changelogs/unreleased/docs-update-vue-naming-guidelines.yml b/changelogs/unreleased/docs-update-vue-naming-guidelines.yml new file mode 100644 index 00000000000..95bfd212370 --- /dev/null +++ b/changelogs/unreleased/docs-update-vue-naming-guidelines.yml @@ -0,0 +1,5 @@ +--- +title: Update vue component naming guidelines +merge_request: 17018 +author: George Tsiolis +type: other diff --git a/doc/development/fe_guide/style_guide_js.md b/doc/development/fe_guide/style_guide_js.md index 02773162801..cd26baa4243 100644 --- a/doc/development/fe_guide/style_guide_js.md +++ b/doc/development/fe_guide/style_guide_js.md @@ -302,20 +302,20 @@ Please check this [rules][eslint-plugin-vue-rules] for more documentation. #### Naming 1. **Extensions**: Use `.vue` extension for Vue components. -1. **Reference Naming**: Use camelCase for their instances: +1. **Reference Naming**: Use PascalCase for their instances: ```javascript // bad - import CardBoard from 'cardBoard' + import cardBoard from 'cardBoard.vue' components: { - CardBoard: + cardBoard, }; // good - import cardBoard from 'cardBoard' + import CardBoard from 'cardBoard.vue' components: { - cardBoard: + CardBoard, }; ```