ホームページ > ウェブフロントエンド > jsチュートリアル > パッケージを npm に公開する方法: ステップバイステップ ガイド

パッケージを npm に公開する方法: ステップバイステップ ガイド

Linda Hamilton
リリース: 2024-11-19 15:55:03
オリジナル
341 人が閲覧しました

NPM (ノード パッケージ マネージャー) でパッケージを公開することは、他の開発者と作業を共有する方法であるだけでなく、開発コミュニティで目立つことにもなります。世界中のさまざまなプロジェクトに統合できる再利用可能なソリューションを作成し、他のプログラマーの時間と労力を節約できることを想像してみてください。

この記事では、NPM で独自のパッケージを構成、公開、保守する方法を段階的に学び、自分の貢献にアクセスできるようにし、開発者としての認知度を高めます。

前提条件

始める前に、次のものが揃っていることを確認してください。

  • NPM がインストールされました。これは、nodejs.org からダウンロードするか、NVM (ノード バージョン マネージャー) を使用できます。
  • npmjs.com で作成されたアカウント

ターミナルで以下のコマンドを実行して、Node.js と NPM のインストールが成功したことを確認します。

node -v
npm -v
ログイン後にコピー
ログイン後にコピー

インストールが正しければ、ターミナルにそれぞれのバージョンが表示されます。
結果は以下のようになります:

$ v20.18.0 # node -v
$ 10.8.2 # npm -v
ログイン後にコピー
ログイン後にコピー

プロジェクトの構成

まず、パッケージに付ける名前を付けてフォルダーを作成します。私の場合は「string-reverser-jm」を選択しました。

mkdir string-reverser-jm # cria a pasta via terminal
cd string-reverser-jm # acessa a pasta via terminal
ログイン後にコピー
ログイン後にコピー

NPM を初期化します:

npm init
ログイン後にコピー
ログイン後にコピー

上記のコマンドを実行すると、package.json ファイルを作成するためにターミナルからいくつかの質問が表示されます。
以下に、入力が必要な各項目について説明します。

  • name: パッケージの一意の識別子。
  • version: セマンティック バージョニングを使用して変更を示します。
  • description: パッケージの機能の簡単な説明。
  • main: エントリ ポイント ファイル (例:index.js.
  • )
  • キーワード: パッケージを分類し、他の開発者が見つけやすくするためのキーワード。
  • 著者: 関連する著者の詳細を追加します。
  • ライセンス: ライセンスは、他の人がコードをどのように使用、変更、配布できるかを定義します。最も一般的なライセンスは MIT であり、オリジナルの著作権表示が提供されている限り、寛容で、大幅な使用の自由が認められています。

質問を終了し、NPM がこの情報を何も持たずにファイルを作成した場合は、作成されたファイルをエディターで開き、不足しているものを追加してください。

例:

{
  "name": "string-reverser-jm",
  "version": "1.0.0",
  "description": "A simple utility to reverse strings, useful for demonstrations and small projects.",
  "main": "index.js",
  "scripts": {
    "test": "echo \"No test specified\" && exit 1"
  },
  "author": "Juliana Macedo <contact@starcoders.info> (https://www.starcoders.info)",
  "keywords": [
    "string",
    "reverse",
    "utility"
  ],
  "license": "MIT"
}

ログイン後にコピー
ログイン後にコピー

コードを書く

プロジェクトのルートにindex.jsファイルを作成します。

function reverseString(str) {
  if (typeof str !== "string") {
    throw new TypeError("Expected a string as input");
  }
  return str.split("").reverse().join("");
}

module.exports = reverseString;

ログイン後にコピー
ログイン後にコピー

パッケージのテスト

公開前にパッケージをテストするには、npm link コマンドを使用します

パッケージ ディレクトリで、次のコマンドを実行します。

npm link
ログイン後にコピー
ログイン後にコピー

パッケージをテストするプロジェクトで、次のコマンドを実行します。

node -v
npm -v
ログイン後にコピー
ログイン後にコピー

パッケージをテスト プロジェクトにインポートして使用し、動作していることを確認します。

$ v20.18.0 # node -v
$ 10.8.2 # npm -v
ログイン後にコピー
ログイン後にコピー

作成されたリンクを削除するには、テスト プロジェクト ディレクトリでコマンド npm unlink string-reverser-jm を実行し、次にパッケージ ディレクトリで npm unlink を実行します。

公開用のパッケージの準備

まず、パッケージの Git リポジトリを作成し、NPM にリンクします。これにより、ソース コードが利用可能になることで透明性と信頼性が高まり、コラボレーションやコミュニティへの貢献が促進され、CI/CD による自動化が可能になり、より効率的な管理とメンテナンスが可能になります。

NPM にリンクするには、リポジトリの https アドレスをコピーし、package.json に追加します。

mkdir string-reverser-jm # cria a pasta via terminal
cd string-reverser-jm # acessa a pasta via terminal
ログイン後にコピー
ログイン後にコピー
  • .gitignore: .gitignore ファイルを作成して、node_modules や .env などのフォルダーとファイルをバージョニングから除外します。
  • .npmignore: .npmignore ファイルを作成して、NPM パッケージに含めないファイルとフォルダーを指定します。
  • README.md: パッケージに関する情報を含むファイルを作成します。

パッケージの公開

ログイン詳細を使用して NPM にログインします:

npm init
ログイン後にコピー
ログイン後にコピー

以下のコマンドを実行してパッケージを公開します:

{
  "name": "string-reverser-jm",
  "version": "1.0.0",
  "description": "A simple utility to reverse strings, useful for demonstrations and small projects.",
  "main": "index.js",
  "scripts": {
    "test": "echo \"No test specified\" && exit 1"
  },
  "author": "Juliana Macedo <contact@starcoders.info> (https://www.starcoders.info)",
  "keywords": [
    "string",
    "reverse",
    "utility"
  ],
  "license": "MIT"
}

ログイン後にコピー
ログイン後にコピー

わかりました。パッケージはすぐに NPM レジストリで利用可能になります!
https://www.npmjs.com/package/string-reverser-jm

パッケージの更新

更新またはバグ修正を行う場合は、以下のコマンドのいずれかを使用して、セマンティック バージョニングに従って package.json のバージョン番号を増やします。

function reverseString(str) {
  if (typeof str !== "string") {
    throw new TypeError("Expected a string as input");
  }
  return str.split("").reverse().join("");
}

module.exports = reverseString;

ログイン後にコピー
ログイン後にコピー

そして、更新されたバージョンを公開します:

npm link
ログイン後にコピー
ログイン後にコピー

よくある問題:

  • パッケージ名はすでに取得されています: 同じ名前のパッケージがすでに存在するために公開が失敗した場合は、まだ取得されていない別の名前を選択してください。
  • 認証エラー: ログインしていて、公開に必要な権限をすべて持っていることを確認してください。
  • バージョンの競合: バージョン番号を更新せずに公開しようとすると、NPM は投稿を拒否します。 npm version を使用してバージョンを上げます。

Como publicar um pacote no npm: um guia passo a passo

Como publicar um pacote no npm: um guia passo a passo

以上がパッケージを npm に公開する方法: ステップバイステップ ガイドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート