前端工程化实战-自定义CLI插件开发：扩展CLI工具箱

前端

2023-11-07 21:40:47

前言

在上一篇的动态模板之后，我们已经完成了一个常规 CLI 工具需要的基本功能，包括了构建（webpack、rollup）、质量（eslint 校验）、模板（动态模板管理）等等可以统一管理的模块。

那么如果想要对我们的工具箱进行个性化定制，或者集成更多有趣的、可复用的模块怎么办？这就是自定义 CLI 插件的用武之地了。

CLI 插件的创建和使用

首先，让我们先来了解一下 CLI 插件的创建和使用。

创建 CLI 插件

创建一个 CLI 插件非常简单，只需要在项目中创建一个新的文件，并以 .plugin.js 作为扩展名即可。

// my-plugin.plugin.js
module.exports = {
  // 插件的名称
  name: 'my-plugin',
  // 插件的
  description: '这是一个示例插件',
  // 插件的命令
  commands: {
    // 命令的名称
    'say-hello': {
      // 命令的
      description: '向你打招呼',
      // 命令的执行函数
      handler: function (args) {
        // 在这里执行你的命令逻辑
        console.log(`Hello, ${args.name}!`);
      }
    }
  }
};

使用 CLI 插件

在创建好 CLI 插件之后，你就可以在你的 CLI 工具中使用它了。

首先，你需要在你的 CLI 工具中安装这个插件。

// package.json
{
  "dependencies": {
    "my-plugin": "1.0.0"
  }
}

然后，你就可以在你的 CLI 工具中使用这个插件了。

// index.js
const cli = require('commander');
const myPlugin = require('my-plugin');

// 加载插件
cli.use(myPlugin);

// 解析命令行参数
cli.parse(process.argv);

自定义 CLI 工具箱的创建

现在，我们已经了解了 CLI 插件的创建和使用，那么我们就可以开始创建一个自定义的 CLI 工具箱了。

首先，我们需要创建一个新的项目。

mkdir my-cli-toolbox
cd my-cli-toolbox
npm init -y

然后，我们需要安装一些必要的依赖项。

npm install commander

接下来，我们需要创建一个新的文件，并以 .cli.js 作为扩展名。

// .cli.js
const cli = require('commander');

// 定义命令
cli
  .command('say-hello <name>')
  .description('向你打招呼')
  .action((name) => {
    console.log(`Hello, ${name}!`);
  });

// 解析命令行参数
cli.parse(process.argv);