使用node构建一个脚手架

182 阅读3分钟

第一步:新建一个空文件夹

第二步:在新建的空文件夹中启动终端,输入命令npm init -y

第三步:配置package.json文件

image.png

第四步:在根目录创建一个index.js文件和bin文件夹,bin文件夹下创建一个index.js文件

重点:bin文件夹下的index.js第一行一定要加上#!/usr/bin/env node,大致意思是用node去运行这个文件

image.png

在终端输入命令:npm link,然后在终端打出自己自定义的命令,也就是package.json中bin对象中的

image.png 如果终端打印出123就代表命令没什么问题

第五步:npm安装插件

有些插件因为版本问题不能require,嫌麻烦的可以用列出的这些,复制放在package.json中

image.png

    "devDependencies": {  
        "chalk": "^4.0.0",  
        "co": "^4.6.0",  
        "commander": "^9.0.0",  
        "download-git-repo": "^3.0.2",  
        "inquirer": "^8.2.1",  
        "log-symbols": "^3.0.0",  
        "ora": "^5.4.1"  
    },

第六步:在根目录创建command文件夹和template.json文件并在command文件中放入增、删、改、查

image.png bin下的index.js中写入方法

#!/usr/bin/env node  
'use strict'  
// 定义脚手架的文件路径  
process.env.NODE_PATH = __dirname + '/../node_modules/'  
const program = require('commander') // 用于捕获命令  
  
// 定义当前版本  
program.version(require('../package').version )  
  
// 定义使用方法  
program.usage('<command>')  
  
// 添加模版  
program  
.command('add')  
.description('添加一个新模版')  
.alias('a')  
.action(() => {  
require('../command/add')()  
})  
  
// 展示模版列表  
program  
.command('list')  
.description('展示所有模版')  
.alias('l')  
.action(() => {  
require('../command/list')()  
})  
  
// 下载模版  
program  
.command('init')  
.description('使用指定模版')  
.alias('i')  
.action(() => {  
require('../command/init')()  
})  
  
// 删除模版  
program  
.command('delete')  
.description('删除一个模版')  
.alias('d')  
.action(() => {  
require('../command/delete')()  
})  
  
program.parse(process.argv)  
if(!program.args.length){  
program.help()  
}

command/add.js

"use strict";  
const co = require("co");  
const prompt = require("co-prompt");  
const config = require("../templates.json");  
const chalk = require('chalk')  
const fs = require("fs");  
  
  
module.exports = () => {  
co(function* () {  
// 分步接收用户输入的参数  
let tplName = yield prompt("模版名字: ");  
let gitUrl = yield prompt("Git链接: ");  
let branch = yield prompt("Git分支名称: ");  
  
// 避免重复添加  
if (!config.tpl[tplName]) {  
config.tpl[tplName] = {};  
config.tpl[tplName]["url"] = gitUrl.replace(/[\u0000-\u0019]/g, ""); // 过滤unicode字符  
config.tpl[tplName]["branch"] = branch;  
} else {  
console.log(chalk.red("模版已经存在!!!"));  
process.exit();  
}  
// 把模板信息写入templates.json  
fs.writeFile(  
__dirname + "/../templates.json",  
JSON.stringify(config),  
"utf-8",  
(err) => {  
if (err) console.log(err);  
console.log(JSON.stringify(config))  
console.log(chalk.green("添加了新模板!!!\n"));  
console.log(chalk.grey("余下模版: \n"));  
for (let configKey in config.tpl) {  
console.log('模版:',configKey)  
}  
console.log("\n");  
process.exit();  
}  
);  
});  
};

command/delete.js

"use strict";  
const co = require("co");  
const prompt = require("co-prompt");  
const config = require("../templates.json");  
const chalk = require("chalk");  
const fs = require("fs");  
  
module.exports = () => {  
co(function* () {  
// 接收用户输入的参数  
let tplName = yield prompt("模版名字: ");  
  
// 删除对应的模板  
if (config.tpl[tplName]) {  
config.tpl[tplName] = undefined;  
} else {  
console.log(chalk.red("模板不存在!!!"));  
process.exit();  
}  
  
// 写入template.json  
fs.writeFile(  
__dirname + "/../templates.json",  
JSON.stringify(config),  
"utf-8",  
(err) => {  
if (err) console.log(err);  
console.log(chalk.green("模板已删除!!!"));  
console.log(chalk.grey("余下模版: \n"));  
for (let configKey in config.tpl) {  
console.log('模版:',configKey)  
}  
console.log("\n");  
process.exit();  
}  
);  
});  
};

command/init.js

"use strict";  
const exec = require("child_process").exec;  
const co = require("co");  
const prompt = require("co-prompt");  
const config = require("../templates");  
const chalk = require("chalk");  
  
module.exports = () => {  
co(function* () {  
for (let configKey in config.tpl) {  
console.log('模版:',configKey)  
}  
// 处理用户输入  
let tplName = yield prompt("模版名字: ");  
let projectName = yield prompt("文件夹名字: ");  
let gitUrl;  
let branch;  
  
if (!config.tpl[tplName]) {  
console.log(chalk.red("\n × 模版不存在!!!"));  
process.exit();  
}  
gitUrl = config.tpl[tplName].url;  
branch = config.tpl[tplName].branch;  
  
// git命令,远程拉取项目并自定义项目名  
let cmdStr = `git clone -b ${branch} ${gitUrl} ${projectName} && cd ${projectName}/src/assets && git clone -b initCss https://gitee.com/liliuyi61/work-template.git InitializeCon`;  
  
console.log(chalk.white("\n 开始生成..."));  
  
exec(cmdStr, (error, stdout, stderr) => {  
if (error) {  
console.log(error);  
process.exit();  
}  
console.log(chalk.green("\n √ 生成已完成!!!"));  
console.log(`\n cd ${projectName} && npm install \n`);  
process.exit();  
});  
});  
};

command/list.js

"use strict";  
const config = require("../templates");  
  
module.exports = () => {  
for (let configKey in config.tpl) {  
console.log('模版:',configKey)  
}  
process.exit();  
};

templates.json

{"tpl":{}}

为了记录一下方法,抄了大佬的,链接放下面了:

www.cnblogs.com/alecc1124/p…