Githubパッケージを使用したライブラリの迅速な発行とインストール


導入


Githubは、あなた自身のパッケージを作成する能力など、いくつかのかなり便利な焼き菓子の機能に付属しています.このチュートリアルでは、GitHubパッケージリポジトリを設定し、簡単な反応フックを作成し、それを公開し、別のプロジェクトにインストールする方法を説明します.
免責事項:このチュートリアル反応のいくつかの基本的な知識を前提とする!

パッケージは何ですか。


パッケージは、個人的にまたは公的に利用可能なコードのファイルまたはディレクトリです.通常これらのファイルはアプリケーションに機能を追加します.
たとえば、世界で最も人気のあるパッケージの一つは、“JavaScriptユーティリティライブラリをモジュール化、パフォーマンス、エクストラ”を提供しています.
これらのパッケージは通常、ローカルにインストールされているときにNodeRoundモジュールと呼ばれるフォルダに住む傾向があります.はい、トンの重さは、GitHubリポジトリに決して委託されるべきではないフォルダー.

ロダッシュ OK、GitHubパッケージは何ですか?


Githubパッケージは、我々が直接作成するパッケージをホストすることができます.それはGitthub API、GitHubアクション、Webhooksとの統合のようなGithub生態系に結び付けられているため、機能の全体的なスレートが付属しています.
Githubパッケージでホストするパッケージとして、我々の反応コンポーネントライブラリを作成します.

パッケージのセットアップ


まず、新しいリポジトリを作りましょう.Githubはすでに行うには徹底的なガイドが含まれます. .文脈のために、Link hereはパッケージ倉庫のセットアップのためのGithubの公式ガイドです.
this
これにより、Visual Studioのコードまたは選択のIDEを開き、ローカルでクローン化しましょう.コードをクリックして、クローンリンクを取得します.

そしてそれをローカルマシンにクローンします.

甘い!NPMを初期化してパッケージを生成できます.JSON
新しいパッケージについていくつか質問されます.名前をそのまま残しておいてください.
@YOUR-USERNAME/YOUR-REPOSITORY 
... 
test command: exit 0 
...

次のコマンドを実行します.
npm install 
git add . 
git commit -m "initialize npm package" 
git push

反応フックの構築


簡単な反応パッケージを構築します.あなたが見たかもしれないように、私は私のパッケージ無駄なフックを命名しました.それで、私は一般的な役に立たないフックを加えます.この場合、ユーザー入力用のイベントリスナーを追加したuseKomamicode.ユーザーが行のキーの特定の組み合わせを入力すると、コールバックをトリガします.
主な隠れ家はフックを作成し、srcフォルダに置きます.

Githubパッケージでのパブリッシング


私たちはパッケージを公開することを確認するためにGithubアクションを使用します.この記事は深さに入らないでしょうが、私は機能性を利用する を持っています.
知っておくべきことは、GitHubがリポジトリにあるかどうかをチェックすることです.あなたのディレクトリのルートで、そして、ワークフローサブフォルダのためのGithubフォルダ.

少数 YAMLとは


以下はサイトからの定義です.

YAML is a human-friendly data serialization language for all programming languages

https://yaml.org/


この場合、Githubでリリースを作成するたびに、ファイルに配置されたワークフローに従ってパッケージを公開します.
ディレクトリのルートに次のフォルダとファイルを作成します.

そして、ファイルに次の行を追加します.

NPMまでそれをフックすること


今、我々はそれを作成することによってNPMにフックすることができます.NPMRCファイルをルートディレクトリに追加し、以下の行を追加します.
@YOUR-USERNAME:registry=https://npm.pkg.github.com
またはパッケージに次のエントリを作成します.JSON
"publishConfig": { 
    "registry": "https://npm.pkg.github.com" 
},
最後に、少なくともリポジトリにすべての変更をプッシュします.
git add . 
git commit -m "workflow to publish package" 
git push

リリースの作成


Githubの上でレポにリリース頭を作成し、右側にリリースセクションが表示されます.先に行くと、新しいリリースを作成します.

その後、新しい画面では、タグ、タイトル、および説明を追加して公開リリースを押すと、リリースを作成することができます.

今すぐGitHubアクションタブでは、我々のワークフローを実行して表示されます!( 1.0.1としてバージョンを見るかもしれませんが、YAMLファイルをアップロードするのを忘れました.😅)

成功!

パッケージライブラリのインストール


以下のコマンドで、例のためにアプリをブートストラップします.
npx create-react-app my-app 
cd my-app
通常、私はNPMのインストールの無駄なフックを直接使用することができますが、まず、我々はGithubパッケージに我々のアプリを指す必要があります.
まず、Githubパッケージに認証しなければなりません.Github自身によってここにこのガイドを残します
クリエイト.NPMRCファイルは、プロジェクトのルートです.

Githubのユーザー名、またはパッケージを作成するために使用したものに置き換えます.
そして、我々のパッケージで.新しい依存関係を含める
"dependencies": { 
    ...other dependencies, 
    "@diballesteros/useless-hooks": "^1.0.1" 
}
実行:
npm install

リンク Githubパッケージライブラリの使用


最後に、我々のパッケージを使用することができます!
我々のアプリで.他のライブラリと同じようにインポートできます.

結論


リポジトリを見つけることができます.私が認証している間、いくつかの問題に遭遇したので、この記事より多くの出版物があります.
あなたがgithubパッケージのために他のヒントを持っているならば、下記のコメントで私に知らせてください.
のより多くの内容
あなたがこれが好きであるならば、私と連絡をとってください
私の自由な開発者ロードマップと毎週のハイテク産業ニュースをhereでチェックしてください.