详解基于node.js的脚手架工具开发经历

2020-06-17 06:38:37易采站长站整理
版本号描述 等信息等,可以通过脚手架的交互进行输入,然后将输入插入到模板中
项目模板并非所有文件都会用到,可以通过脚手架提供的选项移除掉那些无用的文件或者目录。

对于这类情况,我们还需要借助其他工具包来完成。

使用inquirer.js处理命令行交互

对于命令行交互的功能,可以用inquirer.js 来处理。用法其实很简单:


const inquirer = require('inquirer') // npm i inquirer -D

inquirer.prompt([
{
name: 'projectName',
message: '请输入项目名称'
}
]).then(answers => {
console.log(`你输入的项目名称是:${answers.projectName}`)
})

prompt()
接受一个问题对象 的数据,在用户与终端交互过程中,将用户的输入存放在一个 答案对象 中,然后返回一个
Promise
,通过
then()
获取到这个答案对象。so easy!

接下来继续对macaw-init.js进行完善。


// ...

const inquirer = require('inquirer')
const list = glob.sync('*')

let next = undefined
if (list.length) {
if (list.filter(name => {
const fileName = path.resolve(process.cwd(), path.join('.', name))
const isDir = fs.stat(fileName).isDirectory()
return name.indexOf(projectName) !== -1 && isDir
}).length !== 0) {
console.log(`项目${projectName}已经存在`)
return
}
next = Promise.resolve(projectName)
} else if (rootName === projectName) {
next = inquirer.prompt([
{
name: 'buildInCurrent',
message: '当前目录为空,且目录名称和项目名称相同,是否直接在当前目录下创建新项目?'
type: 'confirm',
default: true
}
]).then(answer => {
return Promise.resolve(answer.buildInCurrent ? '.' : projectName)
})
} else {
next = Promise.resolve(projectName)
}

next && go()

function go () {
next.then(projectRoot => {
if (projectRoot !== '.') {
fs.mkdirSync(projectRoot)
}
return download(projectRoot).then(target => {
return {
projectRoot,
downloadTemp: target
}
})
})
}

如果当前目录是空的,并且目录名称和项目名称相同,那么就通过终端交互的方式确认是否直接在当前目录下创建项目,这样会让脚手架更加人性化。

前面提到,新项目的名称、版本号、描述等信息可以直接通过终端交互插入到项目模板中,那么再进一步完善交互流程。


// ...

// 这个模块可以获取node包的最新版本