はじめに
フロントエンドエンジニアのみなさん、こんにちは！
突然ですがパッケージマネージャーの使い分け、大変ですよね。npm を使うプロジェクト、yarn を使うプロジェクト、pnpm や bun なんて新顔も登場して...。コマンドを間違える、構文を調べる手間が増えるなど、頭がこんがらがっちゃいますよね。
そんなみなさんに朗報です！ @antfu/ni という便利ツールがあるのをご存知ですか？
@antfu/ni って何？
@antfu/ni は、Anthony Fu 氏が開発したツールで、プロジェクトに合わせて自動でパッケージマネージャーを切り替えてくれます。
使い方はとってもシンプル。例えば...
ni vue # パッケージマネージャーを自動で判別してインストール
nr dev # npm run dev / yarn dev / pnpm dev を自動選択
便利ですよね！
基本的な使い方はこんな感じです。
| コマンド | npm | yarn | pnpm | bun |
|---|---|---|---|---|
| ni | npm install | yarn install | pnpm install | bun install |
| nr | npm run | yarn run | pnpm run | bun run |
| nlx | npx | yarn dlx | pnpm dlx | bunx |
| nu | npm upgrade | yarn upgrade (yarn up) | pnpm update | bun update |
| nun | npm uninstall | yarn remove | pnpm remove | bun remove |
| nci | npm ci | yarn install --frozen-lockfile | pnpm install --frozen-lockfile | bun install --frozen-lockfile |
今回、こちらをもっと便利にしました。
ni-completion の開発
@antfu/ni は素晴らしいツールですが、シェルの自動補完に対応していません。私自身、日々 @antfu/ni を使う中で、補完機能があればもっと便利になると強く感じていました。例えば...
- パッケージ名を手動で入力しなきゃいけない
- スクリプト名も自分で全部タイプしなきゃいけない
- オプションを調べながら入力しなきゃいけない
そこで私が開発したのが「ni-completion」です。
ni-completion のインストール方法
ni-completion のインストールはとても簡単です。お使いのシェルに合わせて、以下のコマンドを実行するだけ！
Bash
curl -o ~/.ni.bash https://raw.githubusercontent.com/snowsman/ni-completion/main/.ni.bash
echo 'source ~/.ni.bash' >> ~/.bashrc
source ~/.bashrc
Zsh
mkdir -p ~/.zsh/completion
curl -o ~/.zsh/completion/_ni https://raw.githubusercontent.com/snowsman/ni-completion/main/.ni.zsh
echo 'fpath=(~/.zsh/completion $fpath)' >> ~/.zshrc
echo 'autoload -Uz compinit && compinit' >> ~/.zshrc
source ~/.zshrc
これで準備完了です！
ni-completion で何ができるの？
ni-completion ではこんな補完が使えるようになります。
- パッケージ名の自動補完！しかもスコープ付きパッケージにも対応！
- package.json に書かれたスクリプトやインストール済みパッケージの自動補完！
- オプションの自動補完！
ni react[TAB] # react で始まるパッケージを補完
nr [TAB] # dev, build, test などのスクリプトを補完
nun [TAB] # アンインストール時にインストール済みパッケージを補完
ni -[TAB] # -v, --version などのオプションを補完
ni-completion の裏側
インストールする npm パッケージ名の補完は、 からパッケージ情報を取得し、補完候補を生成します。npm search の結果や Public Registry API（registry.npmjs.org）、npms-api（api.npms.io） も検討しましたが、精度が低かったため、https://www.npmjs.com/search/suggestions を採用しました。
スクリプト名やアンインストール時のパッケージ名の補完は、package.json から取得し、補完候補を生成します。package.json の読み込みや解析には、皆さんインストールしているであろう Node.js を使用しています。
ni-completion の将来
ni-completion は、今後もさらに進化していく予定です！ PR や Issue も大歓迎です！
- 新しいパッケージマネージャーや他のシェル環境への対応
- もっとスマートな補完候補の提案
- さらなる高速化
さいごに
ni-completion をぜひ一度試してみてください！開発効率が劇的に向上すること間違いなしです！
詳しくは GitHub リポジトリ をチェックしてみてください。