🔎

npx degit? degit で storybook のサンプル部品を調達

2021/04/29に公開

はじめに

最近は storybook をチョコチョコ触っている。

欲張りで、creat react app + typescript + styled-components + tailwindcss を一気に学ぼうとしている。

tailwind を入れるために無意識に使い始めた

何だかんだで、twin.examples リポジトリに辿り着き、
storybook のチュートリアルをベースに部品を少しずつ調達しながら実装を理解しようとしている。

npx degit は何だ?

そこで疑問を持ったのは、degit って npx のサブコマンド? なんか便利だよね。なんて発音なんだろう?

そう思って、zenn に検索し、一件もヒットしなかった...
qiita も svelte 関連に code はあるものの、説明する文はざっくりみて見当たらなかった。

degit (de+git)

あれ? サブコマンドではないんだ?!
そっか、これも npm に公開している javascript 製ライブラリーである。

degit
発音はおそらく「ディ+ギット」

Javascript 限定ではない、git clone を楽にするツール

まだ最近の自分の検索履歴に残るくらいの「want」ですが、
javascript 関連ではない開発で、あるリポジトリの子階層の中身だけ欲しかったシーンがあり、このstackoverflowにたどり着いた。

複雑さの割りに利用頻度少なそうで、覚えるも試すのもやめ、一回全部 clone してから作業始めた。

自分はツールを入れたり、ショートカットやオプションを覚えることに意欲が高い効率魔と自認しているが、そんな私にとって、git clone filter --, --, -- を覚えるも理解するもちょっとコスパ悪かった。

しかし、degit はそれを変えてくれた。

幅広く使えそうで、global install にした

同じく思う読者は、今すぐ入れましょう〜

npm install -g degit

例えば OSS の linter 設定だけ欲しい

degit vitejs/vite/.eslintrc.js ./.eslintrc.js

degit google/yapf/.vimrc ./.vimrc

git clone --filter を覚えるのが気が向かない。かといって、github の rawfile からコピペするとミスる。

こういう時は、degit を活用するのはいかがでしょう?

Discussion