亲宝软件园·资讯

展开

node shell命令管理

lulu_up 人气:0

背景、

github 地址: https://github.com/lulu-up/record-shell

你有没有经历过忘记某个shell命令怎么拼写? 或是懒得打一长串命令的经历? 比如我的mac笔记本的tachbar偶尔会'卡死', 这时我就要输入 killall ControlStrip 命令重启tachbar, 你也看到了这个命令真心懒得打。

还有新建react项目我每次都要输入npx create-react-app 项目名 --template typescript, 在公司的日常开发中我习惯每次写新需求都单独clone项目并创建新的分支进行开发, 此时就需要去gitlab上复制项目地址然后在本地git clone xxxxxxxxxx 新的项目名, 理论上这些操作真的很重复。

首先本次要带你用node一起动手做一款记录shell命令的小插件, 当然网上类似插件也是有的, 但我这次做了一个最简单粗暴的版本, 自己用着也爽的版本, 并且也想趁机温习一遍命令行相关知识。

一、用法演示

先一起看看这个'库'是否真的方便:

1: 安装

npm install record-shell -g

安装完毕你的全局会多出 rs命令:

2: 添加

rs add

起名随意, 甚至全用汉语更舒服, 这里先演示输入简单命令:

3: 查看 + 使用'

rs ls

命令是可选择的, 这里我先多加几个凑所的命令用来演示:

可以按上下键移动选择, 回车即可执行命令:

当然也可以查看命令详情, 只需-a参数:

rs ls -a

4: 移除

rs rm

5: add有变量的命令

我们的命令当然不会都是写'死'的模式啦, 比如命令 echo 内容 > a.txt, 这里的意思是我要把内容写入目标文件:

6: 使用变量

使用命令时会引导我们填入变量, 所以定义时写汉语就行:

二、初始化自己的node项目

接下来一起从零开始做出这个库, 考虑到一些新手同学可能没做过这种全局的node包, 我这里就讲的详细一些。

初始化项目没啥好说的, 随便起名:

npm init

改造package.json文件:

"bin": {
    "rs": "./bin/www"
  },

这里在 bin内指明, 当运行 rs 命令的时候, 访问"./bin/www"

#! /usr/bin/env node
require('../src/index.js')

三、初始化命令 + 全局安装

这里讲一下如何将我们的命令挂在到全局, 使你可以在任何地方都能使用全局的rs命令:

// cd 我们的项目
npm install . -g

这里比较好理解吧, 相当于直接把项目安装在了全局, 我们平时install xxx -g 是去远端拉取, 这个命令是拉当前目录。

此时那你向index.js文件内写入console.log('全局执行'), 再全局执行 rs 并看到如下效果就是成功了:

四、commander.js (node命令行解决方案)

先安装再聊:

npm install commander

commander的可以帮我们非常规范的处理用户的命令, 比如用户在命令行输入rs ls -a, 原生node的情况下我可以先将输入的args进行拆解, 拆解出 ls 与 -a, 然后再写一堆if判断如果是ls并且后面有-a则如何去做, 但显然这样写不规范, 代码也难以维护, commander就是来帮我们规范这些写法的:

将下面的代码放进 index.js文件中:

const fs = require("fs");
const path = require("path");
const program = require('commander');
const packagePath = path.join(__dirname, "../package.json")
const packageData = JSON.parse(fs.readFileSync(packagePath, 'utf-8'));
program.version(packageData.version)
program
    .command('ls [-type]')
    .description('description')
    .action((value) => {
        console.log('你输入的是:', value)
    })
program.parse(process.argv)

在命令行输入:

rs ls 123456

逐句解释一下代码:

.description('description')顾名思义这里是简介描述, 当我们输入rs -h的时候会出现:

番外

如果你配置program.option('ls', 'ls的介绍'), 则当用户输入rs -h时会出现, 但我感觉加了有点乱, 咱们的插件追求简单所以就没加。

五、inquirer.js(node命令行交互插件)

npm install inquirer

 inquirer可以帮我们生成各种命令行问答功能, 就像vue-cli差不多的效果, 大家可以输入下面代码试一试'单选模式':

program
    .command('ls [-type]')
    .description('description')
    .action(async (value) => {
        const answer = await inquirer.prompt([{
            name: "key",
            type: "rawlist",
            message: "message1",
            choices: [
                {
                    name: 'name1',
                    value: 'value1'
                },
                {
                    name: 'name2',
                    value: 'value2'
                }
            ]
        }])
        console.log(answer)
    })

逐句解释一下代码:

六、添加命令: add

正式开始做第一个命令, 我新建了一个名为env的文件夹, 里面创建record-list.json文件用了存储用户的命令:

 add命令无非就是往record-list.json文件里面增加内容:

program
    .command('add')
    .description('添加命令')
    .action(async () => {
        const answer = await inquirer.prompt([{
            name: "name",
            type: "input",
            message: "命令名称:",
            validate: ((name) => {
                if (name !== '') return true
            })
        }, {
            name: "command",
            type: "input",
            message: "命令语句, 可采用[var]的形式传入变量:",
            validate: ((command) => {
                if (command !== '') return true
            })
        }])
          let shellList = getShellList();
          shellList = shellList.filter((item) => item.name !== answer.name);
          shellList.push({
             "name": answer.name,
             "command": answer.command
          })
          fs.writeFileSync(dataPath, JSON.stringify(shellList));
    })

逐句解释一下代码:

名称可能会重复, 但是不要紧, 因为它的使用场景决定了它不需要做过多的限制。

七、移除命令: rm

这里的原理就是拉取record-list.json数据进行删减, 然后更新record-list.json:

program
    .command('rm')
    .description('移除命令')
    .action(async () => {
        let shellList = getShellList();
        const choices = shellList.map((item) => ({
            key: item.name,
            name: item.name,
            value: item.name,
        }));
        const answer = await inquirer.prompt([{
            name: "names",
            type: "checkbox",
            message: `请'选择'要删除的记录`,
            choices,
            validate: ((_choices) => {
                if (_choices.length) return true
            })
        }])
        shellList = shellList.filter((item) => {
            return !answer.names.includes(item.name)
        })
        fs.writeFileSync(dataPath, JSON.stringify(shellList));
    })

逐句解释一下代码:

八、查看+使用: ls

这里内容稍微多一点, 毕竟一个命令负责两个能力, 这里的核心原理是拉取record-list.json文件的内容展示成单选列表, 然后根据用户选取的值进行命令的执行, 最后返回执行结果;

1: 查看ls, 支持传参 -a

program
    .command('ls')
    .alias('l')
    .description('命令列表')
    .option('-a detailed')
    .action(async (_, options) => {
        const shellList = getShellList();
        const choices = shellList.map(item => ({
            key: item.name,
            name: `${item.name}${options.detailed ? ': ' + item.command : ''}`,
            value: item.command
        }));
        if (choices.length === 0) {
            console.log(`
            您当前没有录入命令, 可使用'rs add' 进行添加
            `)
            return
        }
        const answer = await inquirer.prompt([{
            name: "key",
            type: "rawlist",
            message: "选择要执行的命令",
            choices
        }])
    })

逐句解释一下代码:

2: 判断命令语句中是否有变量

由于允许用户输入的命令内带变量, 比如前面演示过的 echo [内容] > [文件名], 那我就要判断当前用户选中的命令内是否有变量:

const optionsReg = /\[.*?\]/g;
function getShellOptions(command) {
    const arr = command.match(optionsReg) || [];
    if (arr.length) {
        return arr.map((message) => ({
            name: message,
            type: "input",
            message,
        }));
    } else {
        return []
    }
}

逐句解释一下代码:

3: 无变量 -> 执行

这里有一个新的概念:

const child_process = require('child_process');

 child_process可以生成node的'子进程', child_process.exec方法是启动了一个系统shell来解析参数,因此可以是非常复杂的命令,包括管道和重定向。

child_process.exec(command, function (error, stdout) {
        console.log(`${stdout}`)
        if (error !== null) {
            console.log('error: ' + error);
        }
    });

逐句解释一下代码:

4: 有变量 -> 执行

核心原理是解析'变量'后对命令语句进行替换, 然后正常执行就ok:

function answerOptions2Command(command, answerMap) {
    for (let key in answerMap) {
        command = command.replace(`[${key}]`, answerMap[key])
    }
    return command;
}
function handleExec(command) {
    child_process.exec(command, function (error, stdout) {
        console.log(`${stdout}`)
        if (error !== null) {
            console.log('error: ' + error);
        }
    });
}
 if (shellOptions.length) {
        const answerMap = await inquirer.prompt(shellOptions)
        const command = answerOptions2Command(answer.key, answerMap)
        handleExec(command)
    } else {
        handleExec(answer.key)
    }

逐句解释一下代码:

九、让文字变色 (chalk)

功能都完成了, 但是我们的提示文字还是'黑白的', 我们当然希望命令行中多姿多彩一些, 在node中使用:

var red = "\033[31m red \033[0m";
console.log('你好红色:', red)

 \033c语言中的转义字符这里就不扩了, 反正看到他就是要对屏幕进行操作了, 但是我们可以看出上面的写法很不友好, 肯定要封装一下下, chalk.js就是个不错的已有轮子, 我们下进行安装:

npm install chalk

使用:

const chalk = require('chalk') 
chalk.red('你好: 红色')

你高兴太早了, 现在是有问题的 !!

其他教程里都没说怎么解决, 其实那你只要把chalk的版本降低到4就ok了!

加载全部内容

相关教程
猜你喜欢
用户评论