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. poj2513- Colored Sticks 字典树+欧拉通路判断

    题目链接:http://poj.org/problem?id=2513 思路很容易想到就是判断欧拉通路 预处理时用字典树将每个单词和数字对应即可 刚开始在并查集处理的时候出错了 代码: #includ ...

  2. Java学习笔记——排序算法之快速排序

    会当凌绝顶,一览众山小. --望岳 如果说有哪个排序算法不能不会,那就是快速排序(Quick Sort)了 快速排序简单而高效,是最适合学习的进阶排序算法. 直接上代码: public class Q ...

  3. java内存模型二

    数据依赖性 如果两个操作访问同一个变量,且这两个操作中有一个为写操作,此时这两个操作之间就存在数据依赖性.数据依赖分下列三种类型: 名称 代码示例 说明 写后读 a = 1;b = a; 写一个变量之 ...

  4. MyBatis之TypeHandler

    在大学写web应用的时候经常会遇到这么个问题,当我要插入一条数据,某个数据是Date类型,数据库中却是VARCHAR类型,这个时候可能会傻乎乎的先把这个数据自己手动转换成String类型再插入到数据库 ...

  5. php jquery+ajax写批量删除

      为了美观,我还是引入了bootstrap的模态框,我引入的是自己的数据库 library中的一张表 名为:maninfo表 是一张个人信息表  表的加载我就不写了,比较简单,  大概写一下需要的按 ...

  6. js图片大小限制,设置

    //图片大小自动脚本 function AutoResizeImage(maxWidth, maxHeight, objImg) { var img = new Image(); img.src = ...

  7. tab切换插件开发

    我开发的tab切换插件,基于jquery库,实现tab标签页的切换.插件的名称为jquery.tabSwitch.js. 插件实现代码如下: ; (function ($) { $.fn.tabSwi ...

  8. 初识mysql

    一直想试试mysql,但是却一直没有正式的使用过它,也许是因为第一次安装时忘记了root密码,折腾太久留下的后遗症吧,总有点怕怕的.今天第一次使用命令行创建了数据库和数据表,虽然是简单的不能再简单的数 ...

  9. java 与操作系统同步问题(三)————父亲儿子女儿水果问题

    问题描述:父亲每次都会放一个水果在桌子上,女儿喜欢吃香蕉(只吃香蕉), 儿子喜欢吃苹果(只吃苹果).父亲每次只会随机往桌子上放一个水果(苹果或香蕉),儿子,女儿会来取.使用p.v操作来完成父亲.儿子. ...

  10. js实现谷歌坐标转百度坐标

    js实现谷歌坐标转百度坐标 谷歌坐标转百度坐标 实现算法如下(以js为例,其他语言调整就行): //$lat 维度:$lng 经度  function GCJTobaidu($lat, $lng){ ...