ホームページ ウェブフロントエンド jsチュートリアル GitHub Actions を使用して gimme_readme を npm に再公開する

GitHub Actions を使用して gimme_readme を npm に再公開する

Dec 01, 2024 am 02:02 AM

今週のオープン ソース クラスでは、クラスメートと私は、独自のプログラムをそれぞれパッケージ レジストリに公開するという課題を課されました。

誰かがコード レジストリ、パッケージ レジストリ、またはレジストリと言うのを聞くと、これらの言葉は開発者や企業が他の人がダウンロードできるようにコードを公開する場所を表すものだと考えたいと思います。より正確な説明については、Mozilla の次の記事を参照してください。

Re-publishing gimme_readme to npm with GitHub Actions

パッケージ管理の基本 - Web 開発を学ぶ | MDN

これで、パッケージ マネージャーのツアーは終了です。私たちの次の行動は、これまで学んだことをすべて実践して、サンプル ツールチェーンを構築することです。

Re-publishing gimme_readme to npm with GitHub Actions

gimme_readme - npm

gimme_readme は、AI を活用したコマンドライン ツールで、プロジェクトの包括的な README.md ファイルを生成します。複数のソース コード ファイルを一度に分析し、各ファイルの目的、機能、主要コンポーネントの簡潔な説明を提供します。最新バージョン: 1.0.0、最終公開日: 16 時間前。 `npm i gimme_readme` を実行して、プロジェクトで gimme_readme の使用を開始します。 npm レジストリには、gimme_readme を使用する他のプロジェクトはありません。

Re-publishing gimme_readme to npm with GitHub Actions

上でわかるように、(開発者とは対照的に) ユーザー にとって不要なフォルダーやファイルがたくさんあります。たとえば、ユーザーは私の「tests」フォルダーで私のプログラムのコードをテストすることを望むと思いますか? おそらくそうではありません。私のソース コードをフォーマットして lint するために必要な設定ファイルがユーザーに必要だと思いますか? おそらくそうではありません。私のユーザーは何らかの特別な理由で私の「.github」フォルダーを使用する必要があると思いますか? おそらくそうではありません

この目的のために、私はユーザーがダウンロードするものを最小限に抑える解決策を見つけるために取り組んできました。具体的には、プログラムの実行に必要なソース コードのみを提供してもらいたいと考えています。

.npmignore するかしないか?それが質問です。

コードを再公開することを考えていたとき、友人の Uday Rana とも、公開したくないファイルを .npmignore ファイルを使用して「無視」するというアイデアについて話していました。

私がこのトピックについて言及した直後、Uday は .npmignore を Google で検索し、.npmignore ファイルを決して使用してはいけない理由について Jeff D が書いた記事を見つけました。はっきり言っておきますが、私は Jeff の記事に全面的に同意します。

基本的に、どのファイルを公開しないかを明示するのではなく、公開したい内容(ホワイトリスト登録)を明示的すべきであるという考え方です。 > 公開したい (ブラックリストに登録)。

npm を使用すると、公開したいファイルをホワイトリストに登録するのが簡単です。必要なのは、プログラム用にどのファイルを公開するかを示す「file」オプションを追加して package.json ファイルを編集することだけです。

以下は、package.json の「files」オプションのスクリーンショットです。「このプログラムを公開するときに src/ ディレクトリを含める」と記載されています。その後、これらの変更をコミットし、コードの v1.0.0 リリースで利用できるようになりました。

Re-publishing gimme_readme to npm with GitHub Actions

注: デフォルトでは、「files」オプションで何を指定したか指定しなかったかに関係なく、特定のファイルは常に npm に公開されます。 「files」オプションの使用方法について詳しく知りたい場合は、npm の公式ドキュメントで file オプションの使用方法を確認してください。

更新された package.json を使用してコードを npm に公開した後、gimme_readme をインストール/再インストールするユーザーのコンピューターの肥大化が大幅に軽減されます。以下の違いをご覧ください:

Re-publishing gimme_readme to npm with GitHub Actions

新しいリリースを追加するときにコードを npm に公開する GitHub アクションを追加する

(npm 経由で gimme_readme をインストールすることによる肥大化を軽減することで) ユーザーのエクスペリエンスを向上させることに加えて、新しいファイルを作成するときに npm への公開プロセスを自動化する継続的開発パイプライン (略して cd パイプライン) も追加しました。 GitHub でリリースします。これを行う方法の正確な詳細については、GitHub の Node.js パッケージの公開ガイドを参照してください。ボタンを数回クリックするだけで、(CI パイプラインに従って) 安定しているとわかっているコードを GitHub から から 公開できるので、これで良い感じです。

私の CD パイプラインのコードはここにあります。

ウダイを使ったテスト

前に述べたように、私はテストに関して友人の Uday Rana と協力していました。この記事を書いている時点では、彼は私のツールをインストールして次のように使用することができました。

Re-publishing gimme_readme to npm with GitHub Actions

私にとって物事はうまくいっているようで、私のツールに用意されているオプションのほとんどは、多かれ少なかれ彼の期待どおりに動作します。ただし、さらに最適化を追加したいため、このプロセスをもう一度繰り返す必要があります!

旅に終わりはありません…でも、だからこそ楽しいのです!

最近、コードをさらに最適化する方法についても聞きました。特に、GitHub アクションに関する複合アクションや再利用可能なワークフローについて学習することで、CI および CD パイプラインを改善する方法を学ぶことに熱心に取り組んでいます。これらのテクニックによって、作成するコードの量が減り、何らかのパフォーマンスが向上することを願っています。これらのトピックについてはまだあまり知りませんが、おそらく近いうちにブログに書くことになると思います。

そして、私の友人たち、これで私がこのブログで話したかったことは終わります。

また次回お会いしましょう!

以上がGitHub Actions を使用して gimme_readme を npm に再公開するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

フロントエンドのサーマルペーパーレシートのために文字化けしたコード印刷に遭遇した場合はどうすればよいですか? フロントエンドのサーマルペーパーレシートのために文字化けしたコード印刷に遭遇した場合はどうすればよいですか? Apr 04, 2025 pm 02:42 PM

フロントエンドのサーマルペーパーチケット印刷のためのよくある質問とソリューションフロントエンド開発におけるチケット印刷は、一般的な要件です。しかし、多くの開発者が実装しています...

javascriptの分解:それが何をするのか、なぜそれが重要なのか javascriptの分解:それが何をするのか、なぜそれが重要なのか Apr 09, 2025 am 12:07 AM

JavaScriptは現代のWeb開発の基礎であり、その主な機能には、イベント駆動型のプログラミング、動的コンテンツ生成、非同期プログラミングが含まれます。 1)イベント駆動型プログラミングにより、Webページはユーザー操作に応じて動的に変更できます。 2)動的コンテンツ生成により、条件に応じてページコンテンツを調整できます。 3)非同期プログラミングにより、ユーザーインターフェイスがブロックされないようにします。 JavaScriptは、Webインタラクション、シングルページアプリケーション、サーバー側の開発で広く使用されており、ユーザーエクスペリエンスとクロスプラットフォーム開発の柔軟性を大幅に改善しています。

誰がより多くのPythonまたはJavaScriptを支払われますか? 誰がより多くのPythonまたはJavaScriptを支払われますか? Apr 04, 2025 am 12:09 AM

スキルや業界のニーズに応じて、PythonおよびJavaScript開発者には絶対的な給与はありません。 1. Pythonは、データサイエンスと機械学習でさらに支払われる場合があります。 2。JavaScriptは、フロントエンドとフルスタックの開発に大きな需要があり、その給与もかなりです。 3。影響要因には、経験、地理的位置、会社の規模、特定のスキルが含まれます。

JavaScriptを使用して、同じIDを持つArray要素を1つのオブジェクトにマージする方法は? JavaScriptを使用して、同じIDを持つArray要素を1つのオブジェクトにマージする方法は? Apr 04, 2025 pm 05:09 PM

同じIDを持つ配列要素をJavaScriptの1つのオブジェクトにマージする方法は?データを処理するとき、私たちはしばしば同じIDを持つ必要性に遭遇します...

JavaScriptは学ぶのが難しいですか? JavaScriptは学ぶのが難しいですか? Apr 03, 2025 am 12:20 AM

JavaScriptを学ぶことは難しくありませんが、挑戦的です。 1)変数、データ型、関数などの基本概念を理解します。2)非同期プログラミングをマスターし、イベントループを通じて実装します。 3)DOM操作を使用し、非同期リクエストを処理することを約束します。 4)一般的な間違いを避け、デバッグテクニックを使用します。 5)パフォーマンスを最適化し、ベストプラクティスに従ってください。

Shiseidoの公式Webサイトのように、視差スクロールと要素のアニメーション効果を実現する方法は?
または:
Shiseidoの公式Webサイトのようにスクロールするページを伴うアニメーション効果をどのように実現できますか? Shiseidoの公式Webサイトのように、視差スクロールと要素のアニメーション効果を実現する方法は? または: Shiseidoの公式Webサイトのようにスクロールするページを伴うアニメーション効果をどのように実現できますか? Apr 04, 2025 pm 05:36 PM

この記事の視差スクロールと要素のアニメーション効果の実現に関する議論では、Shiseidoの公式ウェブサイト(https://www.shisido.co.co.jp/sb/wonderland/)と同様の達成方法について説明します。

Console.log出力の違い結果:なぜ2つの呼び出しが異なるのですか? Console.log出力の違い結果:なぜ2つの呼び出しが異なるのですか? Apr 04, 2025 pm 05:12 PM

Console.log出力の違いの根本原因に関する詳細な議論。この記事では、Console.log関数の出力結果の違いをコードの一部で分析し、その背後にある理由を説明します。 �...

フロントエンド開発でVSCodeと同様に、パネルドラッグアンドドロップ調整機能を実装する方法は? フロントエンド開発でVSCodeと同様に、パネルドラッグアンドドロップ調整機能を実装する方法は? Apr 04, 2025 pm 02:06 PM

フロントエンドのVSCodeと同様に、パネルドラッグアンドドロップ調整機能の実装を調べます。フロントエンド開発では、VSCODEと同様のVSCODEを実装する方法...

See all articles