背景
命令行工具對於我們來說非常的熟悉，一些命令行的操作也極大的簡化了我們的日常工作。本文就基於我寫的一個Node命令行代碼計數器來進行展開。
相信熟悉linux系統的，對於一些ps,grep,cp,mv…等命令用起來應該愛不釋手，這也是我想要開發一個便捷命令行的初衷，其次就是記錄一個完整開源小玩具的全過程。
命令行的特點：
操作簡便
可視性強
看了一下當前的一些命令行有以下問題
種類少 https://github.com/Towtow10/line-count
顏值不夠 https://github.com/AlDanial/cloc
統計不太方便 https://github.com/ryanfowler/lines
因此這一款高顏值方便的統計工具誕生。
高顏圖
玩具源碼
https://github.com/hua1995116/linec
準備
第三方庫
cli-table
colors
commander
ignore
dev庫(用來測試)
chai
mocha
codecov
istanbu
Node兼容性
babel
靜態文件
語言映射庫
顏色庫
思路
通過commander來獲取用戶的一些自定義配置
program
.version('0.1.0')
.option('-i, --ignore [dir]', 'ignore dir')
.option('-p, --path [dir]', 'ignore dir')
.parse(process.argv);
Node遍歷文件，每種語言行數信息
function getFile(dirPath) {
const files = fs.readdirSync(dirPath);
files.forEach((item) => {
...
})
}
ignore過濾輸出到cache
function handleIgnode(cPath) {
try {
const currentPath = path.join(ROOTPATH, '.gitignore');
const fileData = fs.readFileSync(currentPath, 'utf-8');
const ignoreList = fileData.split('\n');
const filterList = filterData(ignoreList);
const ig = ignore().add(filterList);
return ig.ignores(cPath);
} catch (e) {
return false;
}
}
遍歷cache,統計max-line，進行colors
function hanldeTable(){
...
if (maxCount < langInfo[item].totalLines) {
maxCount = langInfo[item].totalLines;
maxIndex = index;
}
...
}
cli-table 輸出展示
function outputTbale() {
const {
header,
content,
bottom
} = initTable();
const {
totalFiles,
totalCode,
totalBlank,
tablesContent
} = hanldeTable();
...
console.log(`T=${totalTime} s`, `(${fileSpeed} files/s`, `${lineSpeed} lines/s)`)
console.log(header.toString())
console.log(content.toString())
console.log(bottom.toString())
}
改進
loading
對於多文件目錄，提供loading
lass StreamLoad {
constructor(option) {
this.stream = option.stream;
this.text = option.text;
this.clearLine = 0;
}
setValue(value) {
this.text = value;
this.render();
}
render() {
this.clear();
this.clearLine++;
this.stream.write(`read ${this.text} file\n`);
}
clear() {
if(!this.stream.isTTY) {
return this;
}
for (let i = 0; i < this.clearLine; i++) {
this.stream.moveCursor(0, -1);
this.stream.clearLine();
this.stream.cursorTo(0);
}
this.clearLine = 0;
}
}
const progress = new StreamLoad({
stream: process.stderr,
text: 0
})
創建了一個實現loading的類。主要用到readline中的處理方法，詳見https://nodejs.org/dist/latest-v8.x/docs/api/readline.html#readlinereadlinemovecursorstreamdx_dy
babel
對於低版本node的兼容
cnpm i babel-cli
package.json
"build": "./node_modules/.bin/babel src --out-dir lib"
測試用例
chai，mocha
用來測試遍歷文件是否正確
const path = require('path');
const assert = require('chai').assert;
const {getFileData} = require('../src/linec');
describe('linec files test', () => {
it('can linec dir', () => {
const url = path.join(__dirname, '../example');
console.log(url);
const dirObj = JSON.stringify(getFileData(url));
const expectData = '{"CSS":{"file":1,"blankLines":0,"totalLines":4,"color":"#563d7c"},"JavaScript":{"file":1,"blankLines":0,"totalLines":1,"color":"#f1e05a"},"JSON":{"file":1,"blankLines":0,"totalLines":3,"color":"#fff"},"Markdown":{"file":1,"blankLines":0,"totalLines":1,"color":"#fff"}}';
assert.equal(dirObj, expectData);
})
})
運行
./node_modules/mocha/bin/mocha
本項目中還添加了代碼覆蓋率的測試，因此是這樣的
"test": "./node_modules/.bin/istanbul cover node_modules/mocha/bin/_mocha && ./node_modules/.bin/codecov",
發佈
Step1
打開https://www.npmjs.com/signup
註冊一個賬號
step2
如果有賬號直接到這一步
npm login
step3
在package.json中介入version
{
"name": "linec",
"version": "1.2.4",
"description": "line count",
"main": "index.js",
...
}
step4
npm publish
Tip:注意每次發版需要更改package.json 中的version，不然會發版失敗哦。
命令行
package.json
"bin": {
"linec": "./lib/index.js"
},
本地項目命令行
npm link
就可以使用linec 命令，將linec命令軟連接到本地，linec這個名字可以自定義。
遠端命令行
默認就是包名字，但是如果bin裏面定義了一個名字，同上，可以修改名字。也就是包名可以和命令不一致，但是爲了更方便的使用，個人建議統一包名和命令。
詳情可以參考 http://www.ruanyifeng.com/blog/2015/05/command-line-with-node.html
持續集成測試&覆蓋率的自動統計
https://travis-ci.org/
配置.travis.yml
language: node_js
node_js:
- "stable"
sudo: false
before_script:
- npm install
這個是我的配置，每次你的提交，只要含有npm run test命令，travis會自動調用，自動檢測。
travis還有個好處，在別人給你提交pr的時候，可以自動運行測試用例，避免一些低級錯誤的發生。以下就是效果圖。
https://codecov.io/gh
這是一個統計代碼覆蓋率的工具，在npm run test中添加他，在pr的時候可以看到覆蓋率的統計
安裝&使用
$ npm install -g linec / cnpm install -g linec
基礎用法
$ linec
導出到html
$ linec -o
運行完會在當前目錄出現一個output.html
功能
輸出空行，實際行數，總行數
支持400+語言
顯示遍歷速度
顯示多種顏色
支持導出html
工具源碼(歡迎star) https://github.com/hua1995116/linec
效果圖
基礎模式
導出後打開html
結尾
以上就是全部內容，可能對於Node工具開發我可能還是處於初出茅廬的階段，有更規範的操作，歡迎大佬們給我指正。