模板下载
代码语言:javascript复制/**
* @description: 下载模板
* 1.通过项目模板API获取项目模板信息
* 1.1 通过egg.js搭建一套后端系统 hzw-cli-dev-server
* 1.2 通过npm存储项目模板 (vue-cli/vue-element-admin两套模板)
* 1.3 将项目模板信息存储到 mongodb 数据库中
* 1.4 通过 egg.js 获取 mongodb 中的数据并且通过 API 返回
* @param {*}
* @return {*}
*/
async downloadTemplate() {
// 获取模板名称
const { template } = this.projectInfo
// 根据名称匹配到模板信息
const templateInfo = this.template.find((item) => item.npmName === template)
// 拼接路径
const targetPath = path.resolve(userHome, '.hzw-cli-dev', 'template')
const storeDir = path.resolve(userHome, '.hzw-cli-dev', 'template', 'node_modules')
const { npmName, version } = templateInfo
// 创建一个 Package
const templateNpm = new Package({
targetPath,
storeDir,
packageName: npmName,
packageVersion: version,
})
// 检查 package 是否存在
if (! await templateNpm.exists()) {
// 安装
await templateNpm.install();
} else {
// 更新
await templateNpm.update()
}
}
执行完命令后,发现用户主目录下已经有了我们的模板。
代码语言:javascript复制hzw-cli-dev init -tp D:imooc-learnhzw-cli-devhzw-cli-devcommandsinit test-project
通过 spinner 实现命令行 loading 效果
代码语言:javascript复制// 安装 cli-spinner
npm i cli-spinner -S
代码很简单,就几行
代码语言:javascript复制const Spinner = require('cli-spinner').Spinner
const spinner = new Spinner('processing.. %s');
spinner.setSpinnerString('|/-\');
spinner.start();
默认的效果如下
通过 spinner.stop()
停止 loading
效果。但是文本还会显示,传入一个 true
会让 loading
结束后文本消失,也就是 spinner.stop(true)
。
封装成一个方法
代码语言:javascript复制/**
* @description: 命令行加载效果
* @param {*}
* @return {*}
*/
const spinnerStart = (message) => {
const Spinner = require('cli-spinner').Spinner
const spinner = new Spinner(`${message} %s`);
spinner.setSpinnerString('⠋⠙⠹⠸⠼⠴⠦⠧⠇⠏');
spinner.start()
return spinner
}
调用方法
代码语言:javascript复制// 检查 package 是否存在
if (!await templateNpm.exists()) {
// 安装
const spinner = spinnerStart('模板下载中,请稍候...')
await sleep()
await templateNpm.install();
spinner.stop(true)
log.warn('模板下载成功')
} else {
// 更新
const spinner = spinnerStart('模板更新中,请稍候...')
await sleep()
await templateNpm.update()
spinner.stop(true)
log.warn('模板更新成功')
}
效果如下,安装的时候有闪动,可能是 spinner
库的问题,到时候换一个库试一试。
模板更新
先把 hzw-cli-dev-template-vue3
这个模板通过 npm publish
发布一个新版本。
第一次下载模板
可以看到是 1.0.0
版本
第二次更新模板
可以看到多了一个版本
备注:第五周的第七章没看。