基于node的cli工具开发使用详解
前言
如果文章对你有帮助的话,记得一键三连哟。有问题和疑惑的话也可以在评论区留言。我会第一时间回复大家,如果觉得我的文章哪里有知识点错误的话,也恳请能够告知,把错的东西理解成对的,无论在什么行业,都是致命的。
背景
公司内部有维护admin
和h5
两套基础模版,但是每次新项目需要打开gitlab
找git
地址 clone
,稍微有点麻烦,所以集成一个工具,方便使用。
功能特性
下载公司内部前端模版
效果预览
地址
taosiqi/web-cli
插件开发
推荐使用nrm
管理npm
源
- 创建用户
- npm adduser —registry http://127.0.0.1:4873/
- 发布
- npm publish —registry http://127.0.0.1:4873/
使用
- 安装
- npm install web–cli –g —registry http://127.0.0.1:4873/
- 使用
- web–cli create
实现原理
使用到的工具
- chalk: 修改终端颜色
- commander: 添加版本命令提示
- inquirer: 命令行交互
- minimis: 命令行解析
- ora: 终端旋转器
- shelljs: 执行shell命令
- rimraf:删除文件夹
package.json
- {
- “name”: “web-cli”,
- “version”: “0.0.5”,
- “description”: “前端脚手架”,
- “main”: “dist/src/service.js”,
- “author”: {
- “name”: “taosiqi”,
- “email”:“thinlf97@gmail.com”
- },
- “keywords”: [
- “rs”,
- “cli”
- ],
- “bin”: {
- “web-cli”: “dist/src/bin/web-cli.js” //会注册成全局可执行文件
- },
- “scripts”: {
- “dev”: “tsc -w -p .”,
- “build”: “rimraf dist && tsc -p .”,
- “test”: “echo “Error: no test specified” && exit 1″,
- “changelog”: “conventional-changelog -p angular -i CHANGELOG.md -s”
- },
- }
web-cli.ts
- #!/usr/bin/env node
- // 第一行不可少,其作用是它告诉系统这个脚本需要用node解释器来执行。
- // 这个文件主要是用来处理接受参数的入口文件,
- const Service = require(‘../service’) //引入我们的入口文件
- const service = new Service() //实例化Service
- const rawArgv = process.argv.slice(2)
- const args = require(‘minimist’)(rawArgv) //解析命令行参数
- const command = args._[0]
- // 执行初始化
- service.run(command, args, rawArgv)
service.ts
- import program from ‘commander’
- import packageInfo from ‘../package.json’
- import { create } from “./commands/create”;
- module.exports = class Service {
- constructor() {
- setupDefaultCommands() //设置默认命令
- }
- run(_id, _args = {}, rawArgv = []) {
- program.parse(rawArgv, { from: ‘user’ }) //执行相应的命令
- }
- }
- // 设置默认命令
- const setupDefaultCommands = () => {
- program.version(packageInfo.version, ‘-v, –version’, ‘输出当前版本号’)
- program.helpOption(‘-h, –help’, ‘获取帮助’)
- program.command(‘create’).description(‘新建项目’).alias(‘c’).action(async () => {
- await create()
- })
- program.addHelpCommand(false)
- }
create.ts
- import shelljs from ‘shelljs’
- import inquirer from ‘inquirer’
- import * as fs from ‘fs’
- import rimraf from ‘rimraf’
- import log from ‘../utils/log’
- const templateType = {
- type: ‘list’,
- message: ‘请选择模版类型’,
- name: ‘type’,
- choices: [
- {
- name: ‘h5’,
- value: ‘vue3-h5-starter’
- },
- {
- name: ‘admin’,
- value: ‘vue3-admin-starter’
- }
- ]
- }
- const templateName = [
- {
- type: ‘input’,
- message: ‘请输入项目名称:’,
- name: ‘name’,
- validate: (val) => {
- return val !== ”
- }
- }
- ]
- export const create = async () => {
- // 选择模版类型
- let { type } = await inquirer.prompt([templateType])
- // 项目名称
- let { name } = await inquirer.prompt(templateName)
- // 拼接git地址,自行替换「」字段
- const url = `git clone http://gitlab-ci-token:「token」@「ip/域名」/pinxin/${type}.git –depth 1`
- // 执行clone
- await shelljs.exec(url)
- // 重命名
- await fs.renameSync(`./${type}`, `./${name}`)
- // 删除无关文件
- await rimraf(`./${name}/.git`)
- await rimraf(`./${name}/.idea`)
- await rimraf(`./${name}/.vscode`)
- log.succeed(‘创建成功’)
- log.info(`cd ${name}`)
- log.info(`pnpm install`)
- }
以上就是基于node的cli工具开发使用详解的详细内容,更多关于node cli开发工具的资料请关注我们其它相关文章!
发表评论