vue-cli全局安装之后,提供了vue命令和vue init、vue list、vue build三个子命令,通过命令可以搭建基于vue.js的脚手架项目。本文简单介绍一下这些命令是如何实现的。

vue-cli的项目目录

如下图,由之前文章介绍,npm安装过程中,可以利用package.json中bin字段的配置,将bin目录下的命令文件软连到全局命令。也就是说在/usr/local/bin下生成了四个软连命令:vue、vue-build、vue-list、vue-init。

  

vue命令的源码

#!/usr/bin/env node

require('commander')
.version(require('../package').version)
.usage('<command> [options]')
.command('init', 'generate a new project from a template')
.command('list', 'list available official templates')
.command('build', 'prototype a new project')
.parse(process.argv)

  

该命令采用commander.js来实现。commander的主要方法:

(1)parse:用于解析process.argv,将process.argv.slice(2)赋值给program.args

(2)command:创建子命令,子命令的使用方法是command <subcommand> [options],实际调用的命令是command-subcommand,如使用命令行执行vue list,其实是在执行vue-list全局命令;

(3)options:主要设置命令的参数,同时提供参数对应的说明文档,默认提供的option是--help。

vue-init子命令的实现

vue-init的主要功能是拉取指定git目录下的项目模板文件(官方或自制)到指定目录下,用法如下

$ vue init <template-name> <project-name>

  

这里仍需要解析process.argv,所以在vue-init中又引入了commander.js,生成了一个program

program
.usage('<template-name> [project-name]')
.option('--offline', 'use cached template') /**
* Help.
*/ function help () {
program.parse(process.argv)
if (program.args.length < 1) return program.help()
}
help()

  

接下来就是要实现拉取模板文件,经处理后,放置到产出目录下,具体如何实现的,接下来会有专门的文章介绍vue-cli命令的实现原理,敬请期待!

如何使用Node.js编写命令工具——以vue-cli为例的更多相关文章

  1. js node.js 编写命令工具demo

    1 创建文件夹cli-demo 2 执行npm init  3 创建cli.js 文件 内容如下: //js文件变成可执行文件 #!/usr/bin/env node console.log(&quo ...

  2. Node.js编写CLI的实践

    导语:通常而言,Node.js的应用场景有前后端分离.海量web页面渲染服务.命令行工具和桌面端应用等等.本篇文章选取CLI(Command Line Tools)这子领域,来谈谈Node.js编写C ...

  3. 为Node.js编写组件的几种方式

    本文主要备忘为Node.js编写组件的三种实现:纯js实现.v8 API实现(同步&异步).借助swig框架实现. 关键字:Node.js.C++.v8.swig.异步.回调. 简介 首先介绍 ...

  4. Node.js:常用工具util

    概要:本篇博客的主要内容是介绍node.js的常用工具util. 1.util.inherits util.inherits(constructor,superConstructor)是一个实现对象间 ...

  5. Node.js编写be的流程(express)

    Node.js编写be的流程 1.当前项目目录下首先安装express 2.自动生成express插件结构 express -e 3.执行完前两步的效果      4.此时的package.json ...

  6. 实用的 Node.js 教程,工具和资源

    这里分享一批实用的实用的 Node.js 教程,工具和资源. Node.js是一个建立在Chrome之上的JavaScript运行时平台,可方便地构建快速,可扩展的网络应用程序.Node.js使用事件 ...

  7. 利用Node.js编写跨平台的spawn语句

    node const child = cp.spawn('npm', ['run', 'build']); 报错 events.js:182 throw er; // Unhandled 'error ...

  8. 【强烈推荐,超详细,实操零失误】node.js安装 + npm安装教程 + Vue开发环境搭建

    node.js安装 + npm安装教程 + Vue开发环境搭建 [强烈推荐,超详细,实操零失误] 原博客园地址:https://www.cnblogs.com/goldlong/p/8027997.h ...

  9. Node.js之NPM工具使用

    1.NPM介绍:包管理工具 (1)允许用户从NPM服务器下载别人编写的第三方包到本地石使用 (2)允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用 (3)允许用户将自己编写的包或命令行程 ...

随机推荐

  1. hdu1420 Prepared for New Acmer 简单数学

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1420 简单数学题 第一次wa在可能和会出现取模后值为负数的情况. 只要会一个数论上的简单公式(a*b) ...

  2. gitignore.io-程序猿值得拥有的智能生成gitignore文件的秘密武器

    gitignore.io Create useful .gitignore files for your project by selecting from 360 Operating System, ...

  3. java多线程面试总结

    一:基本知识点 1.1线程与进程区别: 1.进程是资源分配的最小单位,线程是CPU调度的最小单位 2.一个进程由一个或多个线程组成 3.进程之间相互独立,每个进程都有独立的代码和数据空间,但同一进程下 ...

  4. selenium+python环境的搭建的自动化测试

    一.安装python: 我安装的是2.7.13版本的:可以在CMD下 运行python命令查看是否安装python,以及安装版本: 在https://www.python.org/getit/这个地址 ...

  5. application 从web.xml中获取初始化参数

    <span style="font-size:24px;"> </span> 1.web.xml中的配置部分 <context-param>   ...

  6. 【JQuery基础知识/statusCode(状态码)】---初学者必备

    今天,给大家分享一下JQuery的基础知识,简单介绍一下JQuery高级_Ajax,和我们常见的一些statusCode(状态码)~~~ 如果存在错误,请大家多多指正留言~小女子在此谢过! 一.JQu ...

  7. 树莓派控制GPIO(Python)

    如果你的raspi没有安装python那么先   sudo apt-get update sudo apt-get install python-dev   例如想要控制35管脚的亮灭: 先建一个文本 ...

  8. Ubuntu怎样进行自由截图操作

    全屏截图 1. 很简单,键盘上右上角都有一个 Print Screen按键,敲一下,全屏截图操作完成. 自由截图 1. 此种方式很简单,打开系统设置->键盘,进入shortcuts选项 2. 点 ...

  9. netty基础--基本收发

    使用maven构建一个基本的netty收发应用,作为其他应用的基础.客户端使用packet sender工具. 1  添加netty依赖 1  maven netty依赖 <dependency ...

  10. Neo4j 第五篇:批量更新数据

    相比图形数据的查询,Neo4j更新图形数据的速度较慢,通常情况下,Neo4j更新数据的工作流程是:每次数据更新都会执行一次数据库连接,打开一个事务,在事务中更新数据.当数据量非常大时,这种做法非常耗时 ...