命令行CLI一键生成各种烦人的lint配置实例

神评论

前言

写一个前端工程，要配置特别多的配置文件，大量的配置文件让我们很烦心，占用了大量写代码的时间。

就像上图，看着就头大。
每次要启动一个新的项目，都要从头配一遍。有人可能把这些文件当做模板保存下来，有需要的时候再复制粘贴。可是各个项目还是不尽相同，还是需要手动改动。
于是我决定写一个命令行工具来解决这件事。

create-lint-config

这个工具叫做

1. create-lint-config

复制代码

，一个一键创建所有的 lint 配置的 CLI 命令行工具。前端工程中特别多的配置文件例如 Eslint、Prettier 等让我们心烦意乱。我们的目标是快速而轻松地生成这些配置！
github 地址
npm 地址

使用

在你的项目根目录执行以下命令：

1. # npm
   
2. npm create lint-config@latest
   
3. # yarn
   
4. yarn create lint-config
   
5. # pnpm
   
6. pnpm create lint-config@latest

复制代码

执行结果如下：

这个命令，一次执行，创建了 Eslint、StyleLint、prettier、commitlint、husy、lint-staged 等所有配置文件。

现有功能

• 生成 Eslint 配置。
  
• 生成 prettier 配置。
  
• 生成 stylelint 配置。
  
• 生成 husky 配置。
  
• 生成 commitlint 配置。
  
• 自动安装依赖。
  
• 期待更多。
  

源码解读

1. #!/usr/bin/env node
   
2. async function install({ pkgManager, cwd, _arguments }: { pkgManager: string; cwd: string; arguments: array }) {}
   
3. async function init() {
   
4.   // 拷贝配置文件基础模板，包括 Eslint、StyleLint、prettier、commitlint、husy、lint-staged
   
5.   await spinner({
   
6.     start: `Base template copying...`,
   
7.     end: 'Template copied',
   
8.     while: () => {
   
9.       try {
   
10.         copy('base')
    
11.       } catch (e) {
    
12.         error('error', e)
    
13.         process.exit(1)
    
14.       }
    
15.     },
    
16.   })
    
17.   // 安装 husky
    
18.   await spinner({
    
19.     start: `Husky installing...`,
    
20.     end: 'Husky installed',
    
21.     while: () =>
    
22.       install({
    
23.         cwd: process.cwd(),
    
24.         pkgManager: 'npx',
    
25.         _arguments: ['husky', 'install'],
    
26.       }).catch((e) => {
    
27.         error('error', e)
    
28.         process.exit(1)
    
29.       }),
    
30.   })
    
31.   // husky 写入 commit-msg 校验指令，使用 commitlint
    
32.   await spinner({
    
33.     start: `Adding commit-msg lint...`,
    
34.     end: 'Commit-msg lint added',
    
35.     while: () =>
    
36.       install({
    
37.         cwd: process.cwd(),
    
38.         pkgManager: 'npx',
    
39.         _arguments: ['husky', 'add', '.husky/commit-msg', 'npx --no-install commitlint --edit ""'],
    
40.       }).catch((e) => {
    
41.         error('error', e)
    
42.         process.exit(1)
    
43.       }),
    
44.   })
    
45.   // husky 写入 pre-commit校验指令，使用 lint-staged 执行 elint 等
    
46.   await spinner({
    
47.     start: `Adding lint-staged...`,
    
48.     end: 'Lint-staged added',
    
49.     while: () =>
    
50.       install({
    
51.         cwd: process.cwd(),
    
52.         pkgManager: 'npx',
    
53.         _arguments: ['husky', 'add', '.husky/pre-commit', 'npx lint-staged'],
    
54.       }).catch((e) => {
    
55.         error('error', e)
    
56.         process.exit(1)
    
57.       }),
    
58.   })
    
59.   // 安装依赖
    
60.   await spinner({
    
61.     start: `Dependencies installing with npm...`,
    
62.     end: 'Dependencies installed',
    
63.     while: () =>
    
64.       install({
    
65.         cwd: process.cwd(),
    
66.         pkgManager: 'npm',
    
67.         _arguments: ['install'],
    
68.       }).catch((e) => {
    
69.         error('error', e)
    
70.         process.exit(1)
    
71.       }),
    
72.   })
    
73. }
    
74. init().catch((e) => {
    
75.   console.error(e)
    
76. })

复制代码

更多源码请移步 GitHub 查看

TODO

• 支持通过
  1. --template

  复制代码
  标志来选择模板，创建更多的配置文件模板，包括 ts、vue、react、node 等等
  
• 支持更灵活的交互式选项。现在只能一键生成默认的模板，有些配置可能是一些人不需要的，后续计划可以更灵活。
  

总结

这个包还在起步阶段，我希望有需求的同学可以来参与贡献。

• 你可以贡献 feature
  
• 提交你自己正在使用的模板，以后用这个工具一键生成
  
• 你也可以 fork 或 clone 此项目，变成你自己的命令行工具
  
• 你也可以发布到你们公司的私有 npm，今年的 KPI 不就有了么
  

github 地址
npm 地址
以上就是命令行CLI一键生成各种烦人的lint配置实例的详细内容，更多关于命令行CLI一键生成lint配置的资料请关注脚本之家其它相关文章！

来源:https://www.jb51.net/article/276298.htm
免责声明：由于采集信息均来自互联网，如果侵犯了您的权益，请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容，谢谢合作！