概述脚手架实现的过程,并使用 NodeJS 完成一个自定义的小型脚手架工具
脚手架就是创建项目基础接口提供项目规范和约定的工具。快速生成项目,创建项目基础结构,几乎代码,在创建项目环节大大提高我们的效率,更加利于代码维护与团队开发。
实现过程:
-
创建目录 sample-scaffolding
-
初始化项目 npm init
-
package.json 中添加bin字段,指定cli文件的入口文件: ‘bin’: ‘./cli.js’(node js cli 的入口文件是通过pageage.json 里面的bin字段指定的)。
-
安装所需要的依赖
npm install inquirer --save (询问交互)
npm install ejs --save (高效的嵌入式 JavaScript 模板引擎) -
创建cli.js 文件
在文件中添加 #!/usr/bin/env node
// 在Node Cli 应用入口文件必须要有上边的文件头
// 如果系统是linux 或者 macOS 还需要修改此文件的读写权限改成755
// 具体就是通过 chomd 755 cli.js 实现修改。
1). cd 你的文件夹路径的上一级目录。
2). sudo chmod -R 777 你的文件夹名。
或者 sudo chmod -R 755 你的文件夹名。
3). 输入密码。
4). success
终端打印信息 usage: chmod [-fhv] [-R [-H | -L | -P]] [-a | +a | =a [i][# [ n]]] mode|entry file …
chmod [-fhv] [-R [-H | -L | -P]] [-E | -C | -N | -i | -I] file … -
在vscode 终端执行
yarn link (把这个模块link到全局)
sample-scaffolding (验证基础是否成功) -
脚手架的工作过程:
1). 通过命令行交互询问用户问题。
2). 根据用户回答的结果生成文件。 -
验证
cd … // 返回
mkdir demo // 创建demo目录
cd demo // 进入
sample-scaffolding // 执行
#!/usr/bin/env node
// fs模块用于对系统文件及目录进行读写操作
const fs = require('fs')
// 用于处理文件路径的小工具
const path = require('path')
// 载入inquirer模块询问用户
const inquirer = require('inquirer')
// ejs 模板引擎
const ejs = require('ejs')
inquirer.prompt([
{
type: 'input',
name: 'name',
message: 'Project name?'
}
]).then(anwsers => {
console.log(anwsers)
// 根据用户回答的结果生成文件
// 明确模板目录
const temDir = path.join(__dirname, 'templates')
// 明确目标目录
// The process.cwd() method returns the current working directory of the Node.js process
const destDir = process.cwd()
// 将模板下的文件全部转换到目标目录
fs.readdir(temDir, (err, files) => {
if(err) throw err
files.forEach(file => {
// file 每个文件的相对路径
// 通过模板引擎渲染文件
ejs.renderFile(path.join(temDir, file), anwsers, (err, result) => {
if(err) throw err
console.log(result, 'result')
// 将结果写入目标目录
fs.writeFileSync(path.join(destDir, file), result)
})
})
})
})