约束前端项目中的目录和文件名

好的目录设计架构就成功了一半 --- 如何约束项目中的目录和文件名

编程中命名规范有：

• camelCase (驼峰命名法)
• PascalCase (帕斯卡命名法，又名大驼峰命名法)
• snake_case (下划线命名法)
• kebab-case (中划线命名法)
• Hungarian notation（匈牙利命名法 - 一个十分系统又古老的命名规范）

背景

入职后接了个新的模块需求，笔者可以自由地创建代码文件目录和文件。上线前回看了下代码，我滴老天爷一会儿大写，一会小写，一会驼峰，之前我好像没这么随便。
为啥之前我没乱写呢？答案是有 CI、CD流水线卡控，不符合规范的代码无法进 master。

问题

代码的文件目录和文件命名缺少约束会导致代码野蛮生长。有人说：好的目录设计架构就成功了一半。

方案

通过正则匹配文件路径。问题来了：我既不会正则也不会获取文件路径。找找工具吧，于是我找到了 ls-lint。 https://ls-lint.org/

ls-lint: ls-lint is an extremely fast file and directory name linter which provides a simple and fast way to bring some structure to your project directories

以前端为例，介绍下使用方式：

添加依赖

npm install @ls-lint/ls-lint # local

添加配置文件

.ls-lint.yml

ls:
  src:
    .js: kebab-case
    .ts: kebab-case
    .d.ts: kebab-case
    .vue: kebab-case

ignore:
  - .git
  - node_modules

ls-lint 的配置非常灵活，可以按照后缀名和子目录分别设置规则。规则包括：lowercase、camelcase、pascalcase、snakecase、screamingsnakecase、regex

执行命令

npx @ls-lint/ls-lint

执行时机

1. Git Hook 的 pre-commit 阶段可以让开发者及时感知、及时修改

2. 流水线上线前某个阶段触发命令，避免开发者本地使用 --no-verify 绕过，双重保险。

   其他

   eslint、stylelint、commitlint 等各种lint 表面上会让某些同学使用起来难受，但是从长远角度看代码规范是非常有必要的。
   eslint-plugin-filename 和 eslint-plugin-folders 是否可以解决上述问题待调研。