推薦一個工作區管理小工具.md

起因

工作中的業務線比較複雜，每個業務線對應一個項目，經常會遇到多個需求并行開發或者在多個項目中排查問題的情況，需要頻繁在不同項目之間切換。

日常接觸到各種新工具自己也會上手試一下，有時候研究到一半可能會被其他事情中斷導緻忘記。

基于對記錄和快速編輯的需求，編寫了一個簡單的小工具：

• 可以記錄工作區目錄，增加和删除
• 可以直接通過VS Code打開工作區進行編輯

小工具介紹

這個小工具使用了一年多，在大部分場景下滿足我自己的需求，也提高了開發效率。小工具使用nodejs編寫，使用了inquire.js來做互動提示，通過上下鍵選擇，回車則使用VS Code打開。使用使用效果：

其他指令(recent可以簡寫為: r)：

• recent add + dirname (相對位址或絕對位址)
• recent del + dirname
• recent ls 檢視已添加的所有工作區資料
• recent ls + str 根據輸入的内容篩選工作區資料
• recent + str 根據輸入内容進行比對并打開

具體使用

在環境變量中添加code指令

在VS Code中使用快捷鍵 Command/ + shift + P 打開指令行面闆，執行安裝code的shell指令。

安裝完成後就可以在指令行中通過

code .

在VS Code中打開檔案或檔案夾。

link recent到全局指令

npm install -g recent-cli      

就可以通過

recent

(或簡寫

r

)來管理工作區了，會調用code指令在VS Code中打開工作區。

其他

安裝的code指令做了什麼操作

# 檢視code指令位址
which code
# 檢視軟連接配接指向
ls -a /usr/local/bin/code      

找到具體的檔案之後，發現是一個shell腳本：

#!/usr/bin/env bash
#
# Copyright (c) Microsoft Corporation. All rights reserved.
# Licensed under the MIT License. See License.txt in the project root for license information.
function realpath() { python -c "import os,sys; print(os.path.realpath(sys.argv[1]))" "$0"; }
CONTENTS="$(dirname "$(dirname "$(dirname "$(dirname "$(realpath "$0")")")")")"
ELECTRON="$CONTENTS/MacOS/Electron"
CLI="$CONTENTS/Resources/app/out/cli.js"
ELECTRON_RUN_AS_NODE=1 "$ELECTRON" "$CLI" "$@"
exit $?      

在MacOS下檢視了一下：

$ELECTRON

是

/Applications/Visual Studio Code.app/Contents/MacOS/Electron

$CLI

/Applications/Visual Studio Code.app/Contents/Resources/app/out/cli.js

$@

就是接收到的檔案夾或檔案位址

open指令

在MacOS下，我們可以通過open -a來指定的應用并傳參：

# 使用Typora打開檔案或檔案夾
open -a Typora README.md 
# 使用Chrome打開檔案或檔案夾
open -a open -a Google\ Chrome cat.png
open -a open -a Google\ Chrome .
預設情況下，open指令會使用檔案的預設應用程式打開。如果檔案是 URL 形式，則檔案将作為 URL 打開:
# 目錄預設使用Finder打開
open .
# html會用預設浏覽器打開
open index.html      

通過

-a

參數可以指定應用程式來打開檔案或目錄，其他支援的參數可以通過

open -h

檢視。

為Open指令建立快捷指令

通過Open指令我們可以使用指定的程式打開指定檔案或目錄，但是open指令打開比較繁瑣，需要輸入完整的程式名稱。

如果想直接通過

typora

打開markdown檔案，我們可以為Open建立快捷指令。

Node.js版本:

#!/usr/bin/env node
// typora.js
const { spawn } = require('child_process')
const params = process.argv.slice(2)
spawn('open', ['-a', 'Typora', ...params]);      

建立軟連接配接

• 直接建立軟連接配接

# 添加可執行權限
chmod +x ./recent.js
# 連結到全局  ln -s 源檔案絕對路徑 本地環境變量
ln -s /User/xxx/typora.js /usr/local/bin/typora      

• 或者放到單獨的目錄，在package.json中指定

{
  "bin":{
    "typora":"./typora.js",
    "t":"./typora.js"
  } 
}      

• 目錄執行link，會自動添加可執行權限并添加軟連接配接到本地環境變量

npm link

我們就可以在指令行中使用

typora

來通過Typora打開指定檔案/檔案夾了，類似的我們可以建立任何快捷指令來打開我們想使用的軟體。

歡迎關注微信公衆号"混沌前端"