優(yōu)先級(jí)A的規(guī)則：
1.組件名為多個(gè)單詞馏谨，但是根組件除外。
如：
export default {
name:'UnitList',
}
2.組件的data 必須是一個(gè)函數(shù)
3.Prop定義應(yīng)該盡量詳盡附迷，至少要指定其類(lèi)型
4.為v-for設(shè)置鍵值惧互，即總是用key來(lái)配合v-for
5.不要把v-for 和v-if 同時(shí)使用在同一個(gè)dom元素上
6.為組件樣式設(shè)置作用域：
a.scoped
b.使用CSS Modules
c.使用BEM 約定（一種前端命名方法論，即block（塊）, element（元素）,modifier(修飾符)）
命名約定模式：
.block{}
.block__element{}
.block--modifier{}
.block 代表了更高級(jí)別的抽象或組件喇伯。
.block__element 代表.block的后代喊儡，用于形成一個(gè)完整的.block的整體。
.block--modifier代表.block的不同狀態(tài)或不同版本稻据。
- 私有屬性名以
yourPluginName)
如：_myGreatMixin_update: function () {
// ...
}
}
}
優(yōu)先級(jí)B的規(guī)則：
1.只要有能夠拼接文件的構(gòu)建系統(tǒng)，就把每個(gè)組件單獨(dú)分成文件
如
components/TodoList.vue
components/TodoInfo.js
而不是Vue.component('TodoItem', {
// ...
})
2.但文件組件應(yīng)該始終以小駝峰命名法或者短橫線命名法捻悯，不要混著用
如
components/myComponent.vue
components/my-component.vue
3.基礎(chǔ)的組件名以一個(gè)特定的前綴開(kāi)頭匆赃，如Basic，App,V
如
components/BasicButton.vue
4.單例組件名即每個(gè)頁(yè)面只使用一次今缚，如header和footer算柳，應(yīng)該The前綴命名，以示唯一性荚斯。
如
components/TheHeading.vue
5.緊密耦合的組件名埠居，以父組件名作為前綴命名查牌。
如
components/TodoListButton.vue
components/UserInfoButton.vue
6.組件名中的單詞順序事期，以高級(jí)別的單詞開(kāi)頭滥壕，描述性的修飾詞結(jié)尾
如
components/SearchButtonCheck
components/SearchButtonReset
7.在Dom中不要使用自閉合組件，但在單文件組件兽泣，字符串模板和 JSX 中可以绎橘。
如：
糟糕的：<my-component/>
優(yōu)秀的：<my-component></my-component>
8.模版中俄組件名要么短橫線要么大駝峰
9.js/jsx中的組件名應(yīng)該使用大駝峰，簡(jiǎn)單的應(yīng)用中可以用短橫線
如
Vue.component('MyComponent', {
// ...
})
import MyComponent from './MyComponent.vue'
export default {
name: 'MyComponent',
// ...
}
10.組件名應(yīng)該傾向于完整單詞而不是縮寫(xiě)
11.在聲明 prop 的時(shí)候唠倦，其命名應(yīng)該始終使用 camelCase称鳞，而在模板和 JSX 中應(yīng)該始終使用 kebab-case
12.多個(gè)特性的元素應(yīng)該分多行撰寫(xiě)，每個(gè)特性一行稠鼻。
如：
<button type="button"
@click="handleClick"
.......
.....
>
而不是<button type="button" @click="handleClick"..... ....... .......>
13.模版中的表達(dá)式應(yīng)該是最簡(jiǎn)單的冈止，復(fù)雜的表達(dá)式應(yīng)該重構(gòu)為計(jì)算屬性和方法
14.復(fù)雜的計(jì)算屬性或者方法拆分成為更簡(jiǎn)單的屬性
15.非空 HTML 特性值應(yīng)該始終帶引號(hào) (單引號(hào)或雙引號(hào)，選你 JS 里不用的那個(gè))候齿。
如
<AppSidebar :style="{ width: sidebarWidth + 'px' }">
16.指令要縮寫(xiě)熙暴，或者要么全部縮寫(xiě)要么全部不縮寫(xiě)
優(yōu)先級(jí)C的規(guī)則
1.組件/實(shí)例的選項(xiàng)應(yīng)該有統(tǒng)一的順序。
2.元素 (包括組件) 的特性應(yīng)該有統(tǒng)一的順序慌盯。
3.在組件/實(shí)例選項(xiàng)中進(jìn)行空行
4但文件組件頂級(jí)元素的順序應(yīng)該是
即 <template></template>
<script></script>
<style></style>
優(yōu)先D的規(guī)則（有潛在危險(xiǎn)的）
1.在v-if. v-if-else v-else 不能缺少key
2.scoped 中不要選擇元素選擇器周霉，要使用類(lèi)選擇器
3.父子組件通信不違反單項(xiàng)數(shù)據(jù)流概念，即通過(guò) prop 和事件進(jìn)行父子組件之間的通信亚皂，而不是 this.$parent 或改變 prop俱箱。
4.應(yīng)該優(yōu)先通過(guò)vuex管理全局狀態(tài)，而不是通過(guò)this. $root或一個(gè)全局事件總線灭必。
