前端項目如何規範文件命名

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

更多規則

官方文檔