コンポーネントライブラリの公開

コンポーネントライブラリを公開して配布し、外部プロジェクトで使用するための戦略は数多くあります。 ステンシルの利点の1つは、ユースケースに適したさまざまな出力ターゲットを簡単に生成できることです。

ノードパッケージマネージャー（NPM）への公開

最初のステップで強く推奨されるステップは、コンポーネントライブラリNPMを公開することです。 Npmは、ライブラリ、ツール、ユーティリティ、パッケージなどを共有するためのオンラインソフトウェアレジストリです。ライブラリがNPMに公開されると、他のプロジェクトはコンポーネントライブラリを依存関係として追加し、独自のプロジェクト内でコンポーネントを使用できます。

package.json

package.jsonファイルの目的は、パッケージのファイルを見つける方法について他のツールに指示を与え、パッケージに関する情報を提供することです。 たとえば、RollupやWebpackなどのバンドラーは、この構成を使用してプロジェクトのエントリファイルを検索します。

コンパイラーを使用する利点は、配布用にプロジェクトを最適にセットアップする方法に関するヘルプを提供できることです。 以下は、プロジェクトの package.jsonファイル内にある一般的なセットアップです。

{
  "main": "dist/index.cjs.js",
  "module": "dist/index.js",
  "es2015": "dist/esm/index.mjs",
  "es2017": "dist/esm/index.mjs",
  "types": "dist/types/components.d.ts",
  "unpkg": "dist/my-project-name/my-project-name.esm.js",
  "collection:main": "dist/collection/index.js",
  "collection": "dist/collection/collection-manifest.json",
  "files": [
    "dist/",
    "css/",
    "loader/"
  ]
}

collectionプロパティは、他のSnteiclアプリケーションで遅延読み込みを可能にするために使用されます。

注： distとdist-custom-elements-bundleの両方を配布する場合は、それらの1つをメインエントリとして選択するのが最善です。それはあなた次第です。