@ pika/pack -大きなNPMパッケージを公開します.

注:この作品は、もともと公開されてpika.dev .
あなたが最近NPMにパッケージを発表したならば、あなたはどのように多くの仕事が現代のビルドプロセスに入るかについてわかっています.JavaScriptをコンパイルして、スクリプトをコンパイルします.あなたのパッケージを設定します.マニフェスト.そして、それはちょうど基本です.
ウェブブラウザとバンドルについてはどうですか?あなたのpackage optimized for them ? ユーザはパッケージをロードできますかUNPKG ? を含めるかtype definitions VSCodeとTypesScriptユーザーのために?それはstripped of all unnecessary files できるだけ小さくするには?あなたのユーザーは、これらの最適化について注意してください、しかし、彼らはすべての権利を得るためにさらに多くの知識、設定、ツール、時間と労力を必要とします.

@ pika / packは手間をかけずに驚くべきパッケージを構築します。

シンプル⚡️ パッケージ全体をビルドするには、あらかじめ設定されたプラグインを使用します.

フレキシブル🏋️‍♀️ 必要に応じてプラグインと最適化を選択します.

ホリスティック⚛️ コード、資産、パッケージを取り扱いましょう.JSONの設定

パッケージビルドパイプライン

@pika/pack あらかじめ設定されたプラグインを接続してパッケージをビルドして最適化します.プラグインは既に人気のあるツールをラップしますBabel and Rollup オプションはすでにNPMの最適化.これは@ PIKA/PACKをあなたのパッケージにビルドします.
@ pika/packもパッケージを作成して設定します.JSONマニフェストをパッケージに自動的に.
これは@pika/pack パッケージ全体をビルド:コード、資産、さらにパッケージ.マニフェスト.パッケージ全体を構築することによって、あなたは完全にビルドされますpkg/ ディレクトリ、公開準備完了.“メイン”、“モジュール”のようなエントリポイント、“UMD:メイン”、“タイプ”、“unpkg”、さらには“副作用”と“ファイル”のような高度なオプションは、すべてのビルドプラグインによって処理されます.
はじめに

// 1. Install @pika/pack!
$ npm install -g @pika/pack
// 2. Add this to your package.json manifest:
"@pika/pack": {"pipeline": []},
// 3. Run @pika/pack!
$ pack build

😎 🆒
だから今何?あなたが走るならばpack build 空のパイプラインで空のパッケージを取得します.それはあまり役に立たない.
あなたを開始するには、ここで私たちの5つの好きなことを行うことです@pika/pack :

1 .デフォルトの( 1行)

"@pika/pack": {
    "pipeline": [
        ["@pika/plugin-standard-pkg", {"exclude": ["__tests__/**/*"]}]
    ]
}

ほとんどのパッケージが使用する最初のプラグインは@pika/plugin-standard-pkg . これが我々の基準だ"source" builder これは、最新のES 2018の言語仕様に任意のJavaScript＆TypeScriptのソースコードを構築します.typescriptはデフォルトでサポートされており、任意のカスタムBabelプラグインをローカルで.babelrc 自動的に使用されます(プラグインは、内部でバベルシュンによって供給されます).
これは私たちのパイプラインの残りの部分を与える標準的なES 2018ターゲットを構築する.ボーナス:あなたのユーザーの何人かは現代のJavaScriptをサポートするかもしれません、そして、より小さくて、より速くて、より肥大したパッケージのためにこのES 2018配布物を直接活用することができます.

2 .発行ノード。JSとWeb最適化( 1行ごと)

"@pika/pack": {
    "pipeline": [
        ["@pika/plugin-standard-pkg"],
        ["@pika/plugin-build-node"],
        ["@pika/plugin-build-web"]
    ]
}

あなたの現代のES 2018ビルドを作成した後、ノードを追加するには些細なことになります.あなたのパッケージに配布されるJSとウェブ.@pika/plugin-build-node ノードを取り除きます.任意のサポートされているノード上で実行するには、JSの準備配信.jsバージョン.@pika/plugin-build-web より近代的なESモジュール(ESM)の配布を構築します:バンドルのために最適化されて、ESM構文をネイティブにサポートするすべてのブラウザーで実行するためにコンパイルされます.
両方のプラグインは内部的にrolulupを使用しますが、任意のバンドルロジックを設定する必要はありません.JSONの3行だけで完全に2つの最も人気のあるJSプラットフォームのために最適化されているパッケージを取得します.なぜなら@pika/pack パッケージ全体をビルドします.JSONマニフェスト自動的に“メイン”、“モジュール”と“ESNEXT”エントリポイントを使用して構成されます.

3 .自動的にtypescript定義( 1行)を生成する

"@pika/pack": {
    "pipeline": [
        ["@pika/plugin-standard-pkg"],
        ["@pika/plugin-build-node"],
        ["@pika/plugin-build-web"],
        ["@pika/plugin-build-types"]
    ]
},

With @pika/pack , すべてのパッケージが自動的に取得.d.ts 入力ファイルの定義ファイル@pika/plugin-build-types プラグイン.JavaScriptを書いている場合でも、このプラグインでは、JavaScript & JsDocから型定義を自動的に生成するためにTypeScriptを使用します.

4 . WASHを発行!または理由、または錆、またはC + +または。（1 - 2行）

"@pika/pack": {
    "pipeline": [
        ["@pika/plugin-wasm-assemblyscript"],
        ["@pika/plugin-wasm-bindings"]
    ]
},

パイプラインのコンセプトはシンプルで柔軟です.パッケージソースがJavaScriptである必要さえないように柔軟です.

@pika/plugin-source-bucklescript - コンパイルの理由やocamlを介して

@pika/plugin-wasm-assemblyscript - スクリプトをコンパイルする

@pika/plugin-wasm-emscripten - C/C++をEmscripten(近日発売予定)でコンパイルします.

@pika/plugin-wasm-bindings - 任意の生成されたワームの簡単なJavaScriptのバインディングを追加します.

パッケージを自動的に強化します( 1行)。

"@pika/pack": {
    "pipeline": [
        ["@pika/plugin-standard-pkg"],
        ["@pika/plugin-build-node"],
        ["@pika/plugin-simple-bin", {"bin": "my-cli"}]
    ]
}

ビルドプラグインもいくつかの本当にエキサイティングな方法で既存のビルドを強化することができます.今私たちのお気に入りの強化は@pika/plugin-simple-bin , どのパッケージに単純なCLIラッパーを注入し、パッケージを設定します.自動的にそれを指すJSON.
@ pika/packをビルドするために@ pika/packを使用しており、特にこのプラグインを使用しますadd a command-line interface パッケージはありません.JSONの設定とセットアップの手間.
私たちは、このラッピング概念で何が可能かを見るのを待つことができません、特にCLISのために:失敗に関してあなたのプログラムを自動的に再開して、実行の後、パッケージ更新をチェックしてください.the possibilities are endless!

パッケージの公開

あなたのパッケージを出版することは、それを構築するのと同じくらい簡単でなければなりません.だから私たちのお気に入りの部分をもたらしたnp (自称「より良いNPM出版」)@pika/pack . とpublish コマンドは、ビルドされたパッケージを公開する方法を心配する必要はありません.ジャストランpack publish あなたのトップレベルのプロジェクトと@ pika/パックでは、新しいバージョンを切断し、パッケージを公開を介して歩いていきます.
それも便利ですunpkg.com 最後に新しいパッケージを見ることができます.

@ pika /パック今日をお試しください！

npm install -g @pika/pack

待ってはいけない@pika/pack あなたの次のパッケージ(または2019アップグレードすることができます任意の古いもの)で.そして、あなたがするとき.
JavaScript生態系を前進させるプロジェクトです.PIKAの使命は、NBM上で近代的なパッケージを見つける、公開、インストール、および使用することを容易にすることによって、現代のJavaScriptをより親しみやすくすることです.うまくいけば@ pika/packは私たちに一歩一歩近づいてその目標に向かっています.

@ pika / packを使用しているプロジェクト

react-async - 柔軟な約束ベースの反応データローダ

hookuspocus - すべての機能のためのフック!

foundationjs - フル機能のnodejsフレームワーク.

graphql-rest-proxy - あなたのREST APIをGraphSQLに変えてください.

custom-attributes - カスタム属性をカスタム要素を定義するのと同じ方法を定義します.

@pika/pack & @pika/web - はい、私たちもuse @pika/pack to build @pika/pack! 🤯

そして、何百もの!Check out our full set of example & starter projects →

パッケージに@ pika/packを使用しましたか?そして、我々はあなたのパッケージをリストに加えます!