前言

創(chuàng)新互聯(lián)是一家專業(yè)從事成都做網(wǎng)站、成都網(wǎng)站設(shè)計(jì)的網(wǎng)絡(luò)公司。作為專業(yè)網(wǎng)絡(luò)公司,創(chuàng)新互聯(lián)依托的技術(shù)實(shí)力、以及多年的網(wǎng)站運(yùn)營(yíng)經(jīng)驗(yàn),為您提供專業(yè)的成都網(wǎng)站建設(shè)、營(yíng)銷型網(wǎng)站建設(shè)及網(wǎng)站設(shè)計(jì)開發(fā)服務(wù)！

之前使用過(guò)一些全局安裝的NPM包，安裝完之后，可以通過(guò)其提供的命令，完成一些任務(wù)。比如Fis3，可以通過(guò)fis3 server start 開啟fis的靜態(tài)文件服務(wù)，通過(guò)fis3 release開啟文件編譯與發(fā)布；還有vue-cli，可以通過(guò)vue init webpack my-project來(lái)初始化vue+webpack的項(xiàng)目基礎(chǔ)配置。最近有一個(gè)需求，需要寫一個(gè)類似vue-cli的NPM包，通過(guò)命令行操作實(shí)現(xiàn)項(xiàng)目初始配置，所以就查看了相關(guān)資料，學(xué)習(xí)了一下如何使用node來(lái)生成自己的命令。

編寫命令行

命令的目標(biāo)：在當(dāng)前目錄下開啟一個(gè)靜態(tài)文件服務(wù),端口號(hào)為8085

1.創(chuàng)建目錄

構(gòu)成命令的基礎(chǔ)是需要一個(gè)命令文件web.js和package.json配置文件，執(zhí)行以下命令：

$ mkdir node-commander #創(chuàng)建一個(gè)文件夾

$ cd node-commander && mkdir bin

$ npm init #初始化package.json文件
$ cd bin && touch web.js #創(chuàng)建命令文件

2.命令文件　

#!/usr/bin/env node

 

var express = require('express');

var path = process.cwd();

 

function run(argv) {

 if (argv[0] === '-v' || argv[0] === '--version') {

 console.log('version is 1.0.0');

 }

 else if (argv[0] === '-h' || argv[0] === '--help') {

 console.log('usage:\n');

 console.log('-v --version [show version]')

 }

 else if (argv[0] === '-s' || argv[0] === '--start') {

 var app = new express();

 app.use('/static', express.static(path));

 app.listen(8085, function () {

 console.log('server start at port 8085');

 });

 }

}

 

run(process.argv.slice(2));　

文件的頭部務(wù)必加入#!/usr/bin/env node這行代碼，這里表示使用node作為腳本的解釋程序，node的路徑通過(guò)env來(lái)查找，可以避免node安裝路徑不一帶來(lái)的問(wèn)題。

其中process為node進(jìn)程中的全局變量，process.argv為一數(shù)組，數(shù)組內(nèi)存儲(chǔ)著命令行的各個(gè)部分，argv[0]為node的安裝路徑，argv[1]為主模塊文件路勁，剩下為子命令或參數(shù)，如下：

node ./bin/web.js a b c

# process.argv的值為[ '/usr/local/bin/node', '/PATH/web.js', 'a', 'b', 'c' ]

3.命令配置

在package.json文件中添加bin字段：

"bin": {

 "web": "./bin/web.js"

 },　　

bin字段的作用：當(dāng)安裝npm包時(shí)，npm將添加一條命令/usr/local/bin/web，web命令軟連接到web.js文件。

調(diào)試命令行

（1）采用install方法

進(jìn)入npm包目錄下，執(zhí)行全局install，根據(jù)package.json中bin的配置，為全局命令創(chuàng)建軟連。

# sudo npm install . -g
/usr/local/bin/web -> /usr/local/lib/node_modules/cli-demo/bin/web.js

/usr/local/lib

`-- cli-demo@1.0.0
...

查看web命令

# which web 

/usr/local/bin/web　　

執(zhí)行web命令

# web --start

server start at port 8085

（2）采用npm link方法

npm link方法創(chuàng)建了兩個(gè)軟連，命令與命令文件的軟連，全局包與實(shí)際包文件的軟連。

# sudo npm link

 

/usr/local/bin/web -> /usr/local/lib/node_modules/cli-demo/bin/web.js

/usr/local/lib/node_modules/cli-demo -> /Users/baidu/hwm/home/demos/node/node-commander　　

接下來(lái)可以按照方法（1）進(jìn)行操作了。

發(fā)布命令包

通過(guò)npm publish進(jìn)行發(fā)布，前提是有npm帳號(hào)。如何操作可以查看npm 官方文檔。

本文是通過(guò)原生node.js來(lái)開發(fā)命令工具，而vue-cli是采用commander.js來(lái)簡(jiǎn)化命令工具開發(fā)，關(guān)于commander.js的使用方法，將在下一篇文章中介紹。

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，如果有疑問(wèn)大家可以留言交流，謝謝大家對(duì)創(chuàng)新互聯(lián)的支持。