由来

CLI命令行界面（英语：command-line interface，缩写：CLI），常见用来进行一些流程化或者批量化的的处理，比如使用CLI创建一个模板工程脚手架。

如何开发一个CLI第一步环境配置安装node

先安装一下node，这里不再赘述。

配置目录

创建一个目录，进入该目录，执行

mkdir cliTemplate
cd cliTemplate
yarn init

配置TypeScript

yarn add --dev typescript @types/node
npx tsc --init

执行上面的命令后，会在目录下生成一个tsconfig.json,找到compileOptions下的outDir，进行修改

{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig.json to read more about this file */
    ...
    "outDir": "./bin",
    ...
  }
}

接着创建src目录和入口文件

mkdir src
cd src
touch index.ts

这里index.ts就是我们要进行核心编码的地方。现在先简单的打印一个hello world。

#!/usr/bin/env node  
console.log(`hello world`);

入口第一行必须是这个#!/usr/bin/env node，用来表示Shebang 是用来通知类 Unix 操作系统这是 NodeJS 可执行文件。因此，我们可以直接调用脚本，而无需调用node。

配置package.json

在packages.json中增加两个配置

{
  ...
  "bin": {
    "cliTemplate":"./bin/index.js"
  },
  "scripts": {
    "tsc":"tsc"
  },
  ...
}

其中scripts是用来编译ts代码的脚本，配置好scripts的tsc后，执行yarn tsc,可以看到根目录下生成一个bin目录，里面有之前创建的index.ts编译后生成的index.js.这个bin目录就是之前在tsconfig.json中配置的"outDir": "./bin"。

接着就是如何像执行命令那样执行我们的项目（就是bin/index.js）。其实现在已经可以使用node来执行项目了，执行node bin,你就会看到hello world的输出。那么如何像执行命令那样执行呢？首先配置package.json，在里面添加一个bin配置

 "bin": {
    "cliTemplate":"./bin/index.js"
  },

接着增加生成的bin/index.js的可执行权限

chmod u+x ./bin/index.js

最后通过执行link创建符号链接

yarn link

之后在命令行执行cliTemplate，可以看到hello world的输出。

重新配置下package.json中的scripts，增加上述流程。

  "scripts": {
    "build":"yarn tsc & chmod u+x ./bin/index.js & yarn link",
    "tsc":"tsc"
  },

后续执行yarn build及完成代码的编译和权限的修改以及符号链接。

如果在执行cliTemplate后发现command not found，那么应该是你的yarn的可执行路径没有加入你自己的PATH的配置中，使用yarn global bin获取yarn globa的bin目录，打开自己的profile文件，在PATH的配置中将该路径加入进去即可。

第二步命令开发用到的三方库

chalk——用来给CLI中的文字添加颜色
commander——nodejs命令行解决方案（核心）
inquirer——可交互的命令行工具，用来编写命令行执行过程中例如选择和输入等处理。

这里在package.json中用到的几个依赖版本是

"dependencies": {
    "chalk": "4.1.2",
    "commander": "^12.1.0",
    "inquirer": "^11.0.2"
  }

封装一个简单的CLI模板

我们来封装一个简单的CLI模板，这个CLI模板工程包括以下几个能力：

文案支持配置颜色

建立一个文件index.ts。新建一个方法

import chalk from 'chalk';
/**
 * 设置文字颜色
 * @param color #RRGGBBAA 
 * @param text 
 * @returns 
 */
export function paintText(color:string,text:string):string{
    return chalk.hex(color)(text);
}

使用方法

import { paintText } from "./util";
console.log(paintText(`#000000FF`,`hello world1`));

设计指定的命令，并且为它的参数添加对应的响应回调

这里直接使用commander进行开发，不进行额外的封装了，

命令行支持可交互

使用inquire实现，使用文档

执行其他CLI指令

/**
 * 执行系统指令
 * @param command 
 */
export function executeCommand(command: string, params: string[]) {
    const result = spawnSync(command, params, { stdio: 'inherit' });
    // 处理错误
    if (result.error) {
        console.error('Error:', result.error);
        process.exit(result.errno);//退出程序
        // 这里可以添加更多的错误处理逻辑
    }
    // 返回命令的状态码
    return result.status;
}

第三步发布

发布npm包，后面的人只需要使用yarn global add xxx（你的包名，就是package.json里的name），安装后就可以全局使用定义的命令。

项目地址

/skateboard1…