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’

Logo

前往低代码交流专区

更多推荐