1.0.0 • Published 1 year ago

wlm-cli v1.0.0

Weekly downloads
-
License
ISC
Repository
-
Last release
1 year ago

开发背景

在使用vuecli的时候发现他的脚手架很有意思,用了几年了,但是一直没有好好研究过这个东西是怎么实现的,所以今天就好好的记录一下这玩意怎么实现的,记录的过程中有什么注意事项我也会标明的,如果有大神觉得我哪里写的有什么问题的话,也可以下方留言,我看到了都会补充说明并表示感谢。

初始化一个package.json

npm init 或者 npm init -y

初始化一个测试文件

#!/usr/bin/env node
console.log("function is success")

运行该文件

node index.js

将node index.js 替换为自定义命令

比如:lm

当我们输入 lm的时候 执行的是node index.js这句话即可

配置package.json

{
  "name": "lm-cli",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "bin": {
    "lm":"index.js"
  }
}

发布该命令

npm link

效果

lm
function is success

注意事项

需要被执行的文件需要使用#!/usr/bin/env node 进行声明 否则是不生效的,该命令是映射到全局的,所以你在任何地方都是可以直接进行使用该命令的,就和你使用vue-cli是一样的效果

移除link

npm unlink // 注意这里必须在项目文件中执行,不可以全局执行

实现过程

脚本命令参数设计

lm --help 查看使用帮助
lm -V|--version 查看工具版本号
lm list  列出所有可用模板
lm inti <template-name> <project-name> 基于制定模板进行项目初始化 <> 代表的是必填项

执行用户输入的命令行操作

import { Command } from 'commander'; //进行命令行的操作
const program = new Command();
使用
program
  .command('use')
  .description('如何使用该cli')
  .action(()=>{
    log(logSymbols.info, chalk.yellow('第一步:运行 wlm list'))
    log(logSymbols.info, chalk.yellow('第二步:运行 wlm init 模板名称 自定义名称'))
    log(logSymbols.info, chalk.yellow('第三步:按照步骤初始化模板即可'))
  })
  
program.parse();
说明

该功能插件提供很多命令操作和很多选项操作,可以自己进行定义一些功能操作,比如获取到用户输入的命令进行下载或者执行一些动作都是可以的