命名规范


  1. 变量命名: 使用小驼峰
// good
let prodcutName = 'name'

// bad
let productname = 'name'
let Productname = 'name'
let ProductName = 'name'

  1. 类命名: 使用大驼峰
// good
class HelloWorld {
  ...
}
function HelloWorld () {
  ...
}
HelloWorld.prototype.say = function () { /*...*/ }

// bad
class helloWorld {
  ...
}
class HELLO_WORLD {
  ...
}

  1. 函数名: 使用小驼峰
// good
function helloWorld () {
  ...
}

// bad
function HelloWorld () {
  ...
}
function HELLO_WORLD () {
  ...
}

  1. 常量: 全部大写字母加下划线
// good
const HELLO_WORLD = 'nihao'

// bad
const helloWorld = 'nihoa'

  1. id选择器: 使用小驼峰
<!-- good -->
<div id="helloWorld"></div>

<!-- bad -->
<div id="hello-world"></div>
<div id="HelloWorld"></div>

  1. class选择器: BEM规范
<div class="dialog">
  <div class="dialog-title">
    <div class="dialog-title-icon"></div>
    <div class="dialog-title-text"></div>
  </div>
  <div class="dialog-content"></div>
</div>

  1. Vue文件命名: 大驼峰
  │  App.vue
  │  main.js
  │  
  ├─assets
  │      logo.png
  │      
  └─components
          HelloWorld.vue

尽量使用英文命名,命名不要超过3个单词,英文简写应尽量表意。