【质量工具】使用ls-lint在 vue3，react 等项目中规范命名

约束文件名

使用例子：

想使 .vue 文件都为首字母大写驼峰形式

可以看到有两个不同命名形式的helloworld这时候运行命令

可以提示改文件命名不符合大写驼峰格式

安装依赖

npm install -D @ls-lint/ls-lint // npm
yarn add -D @ls-lint/ls-lint // yarn
pnpm add -D @ls-lint/ls-lint // pnpm
1
2
3

添加.ls-lint.yml配置

可根据喜好自行配置

官方规则库：

我的配置：

ls:
  src/*:
    .ts: camelCase
    .spec.ts: camelCase
    .d.ts: kebabcase
    .vue: PascalCase
    .story.vue: pointcase
    .md: PascalCase
    .zh.md: PascalCase
    .en.md: PascalCase

ignore:
  - node_modules
1
2
3
4
5
6
7
8
9
10
11
12
13

使用方式

在 package.json 里添加一个scripts

"scripts": {
    "ls-lint": "ls-lint"
  }
1
2
3

然后运行 npx ls-lint 即可

搭配husky使用

在 pre-commit 中添加执行

npx --no-install ls-lint && another scripts
1