12
9

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

npxでGitHubにあるコードを実行する

Last updated at Posted at 2018-07-28

Node.jsやフロントエンドではnpmを使ってライブラリやCLIツールを使うことは多いと思います。
npmでCLIツールを使うときにnpxを使う方も多いかと思います。
しかしnpmjs.comに上がっているバージョンが古かったり、開発中のパッケージを使いたいなどの理由でGitHubにあるコードをそのまま使いたい場面があります。今回はそんなときの方法を紹介します。

npx

npmで一度だけCLIを実行し、CLI実行後は使ったパッケージはローカルに残らないnpxといものがあります。
非常に便利で筆者もcreate-react-appexpress-generatorで雛形を作成するときとかに使っています。
npxに関しては『npxが結構良さそうな件について』や『npm 5.2.0の新機能! 「npx」でローカルパッケージを手軽に実行しよう』にて紹介されているのでそちらをお読みください。

GitHubにあるコードをnpxで実行する

このnpx、npmjs.comにpublishされているコードだけでなくGitHub上にあるコードを実行することも可能です。
以下はnpxでexpress-generatorをGitHub上からコードをダウンロードして実行する例です。
実行されるコードはmasterブランチのコードです。

npx github:expressjs/generator my-express-app

上記のようにnpx github:${ユーザー名}/${リポジトリ名}で実行可能です。普通にnpxを実行するときのパッケージ名の部分をgithub:${ユーザー名}/${リポジトリ名}に変更するだけです。
あとは普通にnpxを使うときのようにコマンドライン引数を指定することも可能です。

注意点

  • プロジェクトルートにあるpackage.jsonに記載されているbinのコードがGitHub上に存在していなければいけません。
  • npmjs.comにpublishされるコードがサブディレクトリに置いてあったりしてプロジェクトルートにない場合もGitHub上のコードをnpxで実行することはできません。create-react-appなんかは実行できません。

所感

この記事を書くきっかけになったのがapi-designerというパッケージでnpmjs.comにpublishされているのにはバグがあるけどGitHubのmasterにあるコードは修正されていました。『RAML: api-designer実行時にrequestが見つからずにエラーになる件について

同じようにバグ修正されいているけどpublishされていないパッケージは他にもあると思います。
あとnpmにpublishすることはできないようなprivateなリポジトリのコードを実行する場合も便利かと思います。
そういったときに本記事で紹介した方法が役立てば幸いです。

最後までお読み頂きありがとうございました。質問等があればコメント欄またはTwitter(@shisama_)までお願いいたします。

12
9
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
9

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?