Zsh
Node.js

Zshでnode_modules/.bin配下を補完に表示する

目的

Zshでnode_modules/.bin配下にパスを通し、Tabキーで補完表示できるようにする。
パスを通す方法はありましたが、補完表示させる方法はなかったので参考になれば嬉しいです。

確認環境

  • Zsh: 5.0.2
  • RHEL: 7.4
  • npm: 5.5.1

.zshenvの編集

# 引数に渡した文字列をPATHに追加する
function append_path() { remove_path $1; export PATH=$PATH:$1; }
function remove_path() { export PATH=`echo -n $PATH | awk -v RS=: -v ORS=: '$0 !="'$1'"' | sed 's/:$//'`; }

# ディレクトリ変更時に削除するPATH
PREVIOUS_NODE_PATH="";

#  カレントディレクトリにnode_modules/.binが存在する場合、PATHに追加する。
#  前回追加したnode_modules/.binをPATHから削除する。
function update_node_path(){
  # 変数の初期化
  current_node_path=""

  # カレントディレクトリにnode_modules/.binディレクトリが存在する場合、PATHに追加する。
  if [ -d ./node_modules/.bin ]; then
    current_node_path=`pwd`"/node_modules/.bin"
    path+=($current_node_path)
  fi

  # 以前のnode_modules/.binが存在する場合、PATHから削除する。
  remove_path $PREVIOUS_NODE_PATH

  # ディレクトリ変更時にPATHから削除するために追加したぱPATHを記憶する
  PREVIOUS_NODE_PATH=$current_node_path
}

# ディレクリ変更時にupdate_node_pathを実行する
autoload -Uz add-zsh-hook
add-zsh-hook chpwd update_node_path

実行結果

  • パスを通したいフォルダ(とコマンド) /home/user/sample-node/node_modules/.bin/vue
カレントディレクトリの確認
$ pwd
/home/user

パスの確認:node_modules/.binは含まれない
$ echo $PATH
/usr/local/bin:/usr/local/sbin 

パスを通したいディレクトリに移動する
$ cd ~/sample-node

パスの確認:node_modules/.binがパスに含まれている!
$ echo $PATH
/usr/local/bin:/usr/local/sbin :/home/user/sample-node/node_modules/.bin

補完が効くことの確認
$ vue
 -- external command --
vue 

ディレクトリを離れるとパスからは削除される
$ cd ~
$ echo $PATH
/usr/local/bin:/usr/local/sbin 

参考記事

コマンドパスを自動で通し npm install -g しない