搭建自己的cli脚手架

2023-08-03  本文已影响0人  小灰灰_a
背景

在我们日常工作中,绝非仅仅开发/维护单一项目,在新开业务线或者新增模块时候,通常会搭建新的项目,虽然现在的vue react 等框架可以快速构建一个基础项目,但是里面的依赖版本、公共方法,统一规范等内容,还是要从老项目里进行copy,有些小伙伴可能会按照自己的喜好重新封装,这样各项目间的规范,请求方法等并不统一,无形中增加了后期开发/维护的成本,让大家不能很好的工(滑)作(水)。

我们应该将最基础的规范、模板等集成到自己的脚手架cli中,这样只需要一行命令,即可初始化完成一个符合自己团队的、具有统一规范的模板,这样大家即使维护不同的项目,也可以愉快的滑水了。

实现

1、使用commander解析命令行;
2、使用inquirer交互式命令行 ;
3、使用child_process执行命令行;
4、使用shelljs监听git命令行状态;

dome

//xhh-cli.js
const program = require('commander');
const inquirer = require('inquirer');
const { exec } = require("child_process");
const shell = require('shelljs');

const expandReact = [{ name: 'react-router-dom', value: 'react-router-dom' }]

const defaultQuestions = [
    // 列表选择
    {
        type: 'list',
        name: 'template',
        message: '请选择模板',
        choices: [{ name: 'react' }, { name: 'vue2' }, { name: 'vue3' }],
    },
    // 拓展
    {
        type: 'checkbox',
        name: 'expand',
        message: '请选择拓展',
        choices: expandReact
    },
    // 输入
    {
        type: 'input',
        name: 'appName',
        message: '请输入应用名称',
        default() {
            return 'project-app';
        },
    },
];

const questions = [...defaultQuestions];

// 定义程序名称,版本
program
    .name('xhh-cli')
    .version('0.0.1')
    .action((options, command) => {
        inquirer.prompt(questions).then(async (res) => {
            exec(`mkdir -p ${res.appName}`, (err) => {
                if (!err) {
                    shell.exec(`git clone xxxx ./${res.appName}`, (code) => {
                        if (code === 0) {
                            console.log('====================================');
                            console.log('初始化成功~');
                            console.log(`cd ${res.appName}`);
                            console.log('npm install');
                            console.log('====================================');
                        }
                    })
                }
            })
        });
    });
// 解析命令行
program.parse(process.argv);
发布
/// package.json
"bin": {
  "xhh-cli": "bin/xhh-cli.js"
},

通过 npm publish 发布我们的脚手架包, npm i xhh-cli -g 下载就能用了

上一篇下一篇

猜你喜欢

热点阅读