1，需求

前端学到后期，全是复制粘贴。
比如React全家桶。Vue2，Vue3全家桶。

Webpack的配置又有很多个品种。

放在git中很松散，需要的时候还要找哪个git中。
所以，需要有一个用于快速搭建项目的轮子。

2，实现结果

这里是我的实现：
https://www.npmjs.com/package/tiny_zip_template

使用方法：

配置环境变量，告诉轮子模版们放在哪里。TEMPLATE_PATH
准备模版文件，xxx.zip。
运行命令行指令，template xxx。

其实就是个zip解压的工具，解压的逻辑还是用的别人的。。。

在这里插入图片描述

然后，需要解压的目录统一由环境变量指定。让解压简单一点。~~（多捞啊）~~

3，用法举例

全局安装：

npm i tiny_zip_template -g

配置环境变量：比如我的是这里。

在这里插入图片描述
那环境变量就是。

在这里插入图片描述
准备一个zip，作为项目模板。

在这里插入图片描述
找一个地方，执行指令。

template 文件名

效果：命令行输出成功！

在这里插入图片描述
出现了解压后的文件。

在这里插入图片描述
最后，试试启动项目。

在这里插入图片描述
没有问题。

后续的使用中，直接敲指令即可。

4，实现过程

三个数据：

//文件名
const fromZip = process.argv[2]
//文件路径
const templateFolder = process.env["TEMPLATE_PATH"]
//工作路径
const toFolder = process.cwd()

缺失判断：

if (!templateFolder) {
	console.log("未配置环境变量：TEMPLATE_PATH")
	return
} else if (!fromZip) {
	console.log("未指定模版名")
	return
} else {
	//...
}

解压逻辑：直接调用三方的。

function unzip(from, to) {
	const compressing = require("compressing");
	compressing.zip.uncompress(from, to)
		.then(() => {
			console.log('成功！');
		})
		.catch(err => {
			console.error(err);
		})
}

调用解压：

const path = require("path");
let zipFile = path.resolve(templateFolder, fromZip + ".zip")

console.log(zipFile)

unzip(zipFile, toFolder)

是不是很简单？

0 条评论