理解什么是脚手架

131 阅读1分钟

脚手架简介

  • 脚手架本质是操作系统的客户端
  • 描述脚手架命令执行过程

image.png

输入 vue create vue-test-app 实际要查看环境变量中是否有vue命令(相当于执行which vue),去查询时间链接文件,
如果有,通过查看文件中!/user/bin/env的值,判断由谁执行该文件;
如果!/user/bin/env node,则由node执行该文件

脚手架开发流程

  • 创建npm项目
  • 创建脚手架入口文件,在最上方添加 #!/usr/bin/env node(实际上 是提示操作系统去通过env这个命令在环境变量中找到node,然后使用node执行当前的入口文件)
  • 配置package.json,添加bin属性,指定脚手架的名称,以及它对应的入口文件地址
  • 编写脚手架代码
  • 将脚手架发布到npm

使用流程

  • 安装脚手架 npm i -g your-own-cli
  • 使用脚手架 your-own-cli

脚手架开发难点

  • 分包:将复杂的系统拆分成若干个模块
  • 命令注册,例如
vue creat 
vue add
vue invoke
  • 参数解析

    vue command [options] <params>
    
  • options全称: 比如:--version、--help

  • options简写:-v、-h

  • 带params的options: 例如 vue create --name vueTest

  • 帮助文档:

    • global help
      • Usage
      • Options
      • Commands

image.png

  • 还有很多,比如
    • 命令行交互
    • 日志打印
    • 命令行文字报错
    • 网络通信:http/websocket
    • 文件处理
    • 等等...