关于javascript:基于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() //实例化Serviceconst 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`)}

援用

首发于掘金，欢送关注