ni (@antfu/ni) のシェル補完を実現！ ni-completion で開発効率を劇的に向上！

## はじめに

フロントエンドエンジニアのみなさん、こんにちは！
突然ですがパッケージマネージャーの使い分け、大変ですよね。npm を使うプロジェクト、yarn を使うプロジェクト、pnpm や bun なんて新顔も登場して...。コマンドを間違える、構文を調べる手間が増えるなど、頭がこんがらがっちゃいますよね。

そんなみなさんに朗報です！ @antfu/ni という便利ツールがあるのをご存知ですか？

## @antfu/ni って何？

[@antfu/ni](https://github.com/antfu-collective/ni) は、Anthony Fu 氏が開発したツールで、プロジェクトに合わせて自動でパッケージマネージャーを切り替えてくれます。

使い方はとってもシンプル。例えば...

```bash
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

```bash
curl -o ~/.ni.bash https://raw.githubusercontent.com/snowsman/ni-completion/main/.ni.bash
echo 'source ~/.ni.bash' >> ~/.bashrc
source ~/.bashrc
```

### Zsh

```bash
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 ではこんな補完が使えるようになります。

1. パッケージ名の自動補完！しかもスコープ付きパッケージにも対応！
2. package.json に書かれたスクリプトやインストール済みパッケージの自動補完！
3. オプションの自動補完！

```bash
ni react[TAB]  # react で始まるパッケージを補完
nr [TAB]       # dev, build, test などのスクリプトを補完
nun [TAB]      # アンインストール時にインストール済みパッケージを補完
ni -[TAB]      # -v, --version などのオプションを補完
```

## ni-completion の裏側

インストールする npm パッケージ名の補完は、<npmjs.com> からパッケージ情報を取得し、補完候補を生成します。`npm search` の結果や [Public Registry API（registry.npmjs.org）](https://github.com/npm/registry/blob/main/docs/REGISTRY-API.md)、[npms-api（api.npms.io）](https://api-docs.npms.io/) も検討しましたが、精度が低かったため、https://www.npmjs.com/search/suggestions を採用しました。

スクリプト名やアンインストール時のパッケージ名の補完は、package.json から取得し、補完候補を生成します。package.json の読み込みや解析には、皆さんインストールしているであろう Node.js を使用しています。

## ni-completion の将来

ni-completion は、今後もさらに進化していく予定です！ PR や Issue も大歓迎です！

- 新しいパッケージマネージャーや他のシェル環境への対応
- もっとスマートな補完候補の提案
- さらなる高速化

## さいごに

ni-completion をぜひ一度試してみてください！開発効率が劇的に向上すること間違いなしです！

詳しくは [GitHub リポジトリ](https://github.com/snowsman/ni-completion) をチェックしてみてください。