脚手架工具就是在启动它之后自动询问一些预设的问题,然后将回答的结果结合一些模板文件生成一个项目的结构
通过node.js开发一个小型的脚手架工具
脚手架工具就是一个cli应用,创建脚手架工具就是创建一个cli的应用
# 步骤
mkdir sample-scaffolding
cd sample-scaffolding
yarn init -y
code . //此命令打开package.json这个文件
# package.json文件中添加一个bin字段
"bin":"cli.js",用于指定cli应用的入口文件
然后添加cli.js这个文件
# 文件内容
# #!/usr/bin/env node 此处内容不需要加
console.log('cli working')
# yarn link 到全局、
yarn link
# 此时在命令行中去使用sample-scaffolding这个命令
控制台打印
则意味着cli应用的基础就完成了
#### 若不成功
则需要加入一下引用(作用就是可以被当成一个命令执行, 而不用 node cli.js 这样执行)
#!/usr/bin/env node
##### // Node CLI 应用入口文件必须要有这样的文件头
# 安装inquirer模块 可以帮我们发起命令行询问
yarn add inquirer
# 安装ejs模块,模板引擎
yarn add ejs
cli.js
#!/usr/bin/env node
// Node CLI 应用入口文件必须要有这样的文件头
// 如果是 Linux 或者 macOS 系统下还需要修改此文件的读写权限为 755
// 具体就是通过 chmod 755 cli.js 实现修改
// 脚手架的工作过程:
// 1. 通过命令行交互询问用户问题
// 2. 根据用户回答的结果生成文件
const fs = require('fs')
const path = require('path')
const inquirer = require('inquirer')
const ejs = require('ejs')
inquirer.prompt([
{
type: 'input',
name: 'name',
message: 'Project name?'
}
])
.then(anwsers => {
// console.log(anwsers)
// 根据用户回答的结果生成文件
// 模板目录
const tmplDir = path.join(__dirname, 'templates')
// 目标目录
const destDir = process.cwd()
// 将模板下的文件全部转换到目标目录
fs.readdir(tmplDir, (err, files) => {
if (err) throw err
files.forEach(file => {
// 通过模板引擎渲染文件
ejs.renderFile(path.join(tmplDir, file), anwsers, (err, result) => {
if (err) throw err
// 将结果写入目标文件路径
fs.writeFileSync(path.join(destDir, file), result)
})
})
})
})
# templates文件夹下为需要批量生成的文件
### 测试,执行命令
cd ..
mkdir demo-sample
cd demo-sample
sample-scaffolding
# 根据提示交互信息输入name,然后去demo-sample文件夹下查看,模板文件已生成
中途出现的问题:
sample-test : 无法将“sample-test”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再试一次。
所在位置 行:1 字符: 1
+ sample-test
+ ~~~~~~~~~~~
+ CategoryInfo : ObjectNotFound: (sample-test:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
解决途径: https://blog.csdn.net/weixin_45047039/article/details/109851573
解决yarn link将cli模块链接全局后无法使用的问题
当我们创建了一个cli模块后,使用yarn link 将其链接全局,成功会有如下提示:
但是使用这个命令时却会报错
大概率时环境变量中没有配置yarn的全局变量文件
首先,通过yarn global bin查看yarn的全局变量文件,例如我这里是:
然后右击我的电脑—>属性—>高级系统设置—>环境变量—>系统变量—>Path
将刚才拿到的yarn全局变量地址添加进去即可。
注意:如果设置之前打开了命令行窗口,此时直接输入yarn中的全局命令依旧不行,需要开启新的命令行窗口,包括VScode中的命令行工具,需要重启VScode才行。
————————————————
版权声明:本文为CSDN博主「火鸡面多放火鸡」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/weixin_45047039/article/details/109851573