前端项目如何规范文件命名

前端项目如何规范文件命名

ls-lint 是一个非常快的文件和目录名称 linter，可方便约束项目目录和文件的命名。

特点：

• 快速
• 依赖少
• 适用所有文件
• 配置简单

1. 安装依赖

npm install @ls-lint/ls-lint -D

在 husky 加入 git hook:

"husky": {
  "hooks": {
    "pre-commit": "ls-lint",
  }
}

没有安装 husky ，需要安装。安装 4.3.8，5 以上版本有问题。

2. 配置命名规则

项目根目录下，新建 .ls-lint.yml ，内容为：

ls:
  src/*:
    .vue: PascalCase | regex:^index
    .less: PascalCase | regex:^index
    .scss: PascalCase | regex:^index # 相同的命名规则，编辑器会将组件和组件关联的样式文件挨在一起，方便浏览
    .js: kebab-case # | PascalCase
    .ts: kebab-case # camelCase | PascalCase
    .d.ts: kebab-case
    .mock.ts: kebab-case
    .data.ts: camelCase | kebab-case
    .test-d.ts: kebab-case
    .spec.ts: camelCase | PascalCase

ignore:
  - assets/style
  - node_modules
  - .git
  - .circleci
  - .github
  - .vscode
  - dist
  - .local

更多规则

官方文档