Vue文件命名规范

Vue项目中的文件/文件夹命名规范

1、components、views下文件夹/文件命名

a、文件夹命名使用大写字母开头PascalBase风格
b、必须包含index.vue
c、其他文件名以大写开头PascalBase风格

eg:

• [components]

  • [Breadcrumb]
    • index.vue
    • ItemDetail.vue
  • [Hamburage]
    • index.vue
  • [SvgIcon]
    • index.vue

• [viwes]

  • [Home]
    • index.vue
  • [Article]
    • index.vue
    • ArticleDetail.vue

2、*.js文件命名规范

a、属于类的.js文件,除了index.js,其他使用PascalBase风格
b、属于其他类型的.js文件,使用kebab-case风格
c、属于Api的, 统一加上Api后辍

eg:

• index.js
• ParentChidren.js
• HomeApi.js

3、*.vue文件命名规范

除index.vue外，其他vue文件统一使用PascalBase风格

eg:

• index.vue
• ArticleDetail.vue

4、.less/.scss文件命名规范

统一使用kebab-case命名风格

eg:

• article-detail.less / article-detail.scss

5、css类名命名规范

统一使用 kebab-case命名风格

eg: .article-container

6、方法命名（采用动词+名词），驼峰式划分语义

eg: doSomething(){}

7、变量命名，驼峰式命名

eg: let myName = ‘ken’