ホームページ  >  記事  >  ウェブフロントエンド  >  uniapp およびミニ プログラムの下請け手順の詳細については、こちらをご覧ください。

uniapp およびミニ プログラムの下請け手順の詳細については、こちらをご覧ください。

青灯夜游
青灯夜游転載
2021-09-08 19:21:214848ブラウズ

ユニアプリとミニプログラムを外注するにはどうすればよいですか?ユニアプリとミニプログラムの下請けの手順については、次の記事で詳しく説明していますので、お役に立てれば幸いです。

uniapp およびミニ プログラムの下請け手順の詳細については、こちらをご覧ください。

1. ミニ プログラムのサブパッケージ化

サブパッケージ化を使用する各ミニ プログラムには、メイン パッケージが含まれている必要があります。いわゆるメイン パッケージにはデフォルトのスタートアップ ページ/TabBar ページが配置され、いくつかのパブリック リソース/JS スクリプトがすべてのサブパッケージに必要ですが、サブパッケージは開発者の構成に従って分割されます。

ミニ プログラムが開始されると、デフォルトでメイン パッケージがダウンロードされ、メイン パッケージ内のページが起動されます。ユーザーがサブパッケージ内のページに入ると、クライアントは対応するパッケージをダウンロードします。表示

現在、ミニ プログラムのサブパッケージのサイズには次の制限があります:

ミニプログラム全体のすべてのサブパッケージのサイズプログラムは 20M を超えない 1 つのサブパッケージ/メイン パッケージのサイズは 2M を超えることはできません ミニ プログラムを下請けにすると、ミニ プログラムの初回起動時のダウンロード時間が最適化され、複数のチームが一緒に開発する際のより適切な分離とコラボレーションが可能になります。

ここを直接クリックすると、わかりやすい公式のサブパッケージ化チュートリアルが表示されます:

https://developers.weixin.qq.com/miniprogram/dev/framework/subpackages/ Basic.html

2. uniapp 下請けアプレット

App のデフォルトはパッケージ全体です。ミニプログラムの下請け構成にも対応。その目的はダウンロードを高速化することではなく、ホームページが vue の場合の起動を高速化することです。 [関連する推奨事項: "uniapp チュートリアル "]

  • components: パブリック コンポーネント (メイン パッケージによる参照用)
  • page_その後にピンインが続くものはすべてサブパッケージです
  • サブパッケージ内のコンポーネントは、単一のサブパッケージのコンポーネント ディレクトリです。サブコントラクトされた vue ページへの参照は、独自の page_xxxx サブコントラクト ディレクトリでのみ参照できます。
  • pages はメイン パッケージであり、これらはすべてスタートアップ ページ/タブバー ページです。
  • static はパブリック静的リソースとイメージ クラスを配置します

下請けの手順:

1.manifest.json を構成します

"mp-weixin": {
"optimization":{"subPackages":true}
}

uniapp およびミニ プログラムの下請け手順の詳細については、こちらをご覧ください。

下請けの最適化:

対応するプラットフォームの構成内 (マニフェスト .json) に "optimization":{"subPackages":true} を追加してサブパッケージの最適化を有効にします。

現在、mp-weixin、mp-qq、および mp-baidu のサブパッケージの最適化のみをサポートしています

  • 静的ファイル: サブパッケージ化は、static などの静的リソースのコピーをサポートします。つまり、サブパッケージング ディレクトリに配置された静的リソースはメイン パッケージにパッケージ化されず、
  • js ファイルはパッケージ化されません。メインパッケージで使用される: 特定の js が 1 つのサブパッケージによってのみ参照される場合、その js はサブパッケージにパッケージ化されます。それ以外の場合は、引き続きメイン パッケージにパッケージ化されます (つまり、メイン パッケージによって参照されます)。 、または複数のサブパッケージによって参照される)
  • カスタム コンポーネント: カスタム コンポーネントが 1 つのサブパッケージによってのみ参照され、サブパッケージに配置されていない場合、コンパイル中にプロンプ​​ト メッセージが出力されます。

2. 構成ページ .json

pages.json に新しい配列「subPackages」を作成します。配列には 2 つのパラメーターが含まれます: 1.root:サブパッケージのルート ディレクトリ、2.pages: サブパッケージが構成されているページ、パラメータはページと同じです;

注: メイン パッケージとサブパッケージを同じディレクトリに置くことはできません。 uniapp プロジェクトでは、後でサブコントラクトするためのディレクトリ構造を検討できます;

uniapp およびミニ プログラムの下請け手順の詳細については、こちらをご覧ください。

3. プリロード設定のサブコントラクト (preloadRule)

このステップは主に速度を最適化するために行われます。速度を最適化したくない場合は、この構成をスキップできます。

preloadRule を構成した後、ミニ プログラムの特定のページに入ると、フレームワークは自動的に後続のサブパッケージ ページに入るときの起動速度を向上させるために必要なサブパッケージを事前にダウンロードします。

preloadRule では、キーはページ パス、値はこのページに入る事前にダウンロードされた構成です。各構成には次のものがあります。次の項目:

フィールド タイプ 必須 デフォルト値 説明
packages StringArray is None ページに入ると、サブパッケージ化された root または name を事前にダウンロードします。 __APP__ はメイン パッケージを表します。
network String No wifi 指定されたネットワーク下での事前ダウンロード、オプションの値対象: すべて (ネットワークに限定されない)、Wi-Fi (Wi-Fi 環境下での事前ダウンロードのみ)

アプリ サブパッケージ、preloadRule もサポートされていますが、ネットワーク ルールは無効です。

#公式の設定項目を表示できます:

https://uniapp.dcloud.io/collocation/pages?id=subpackages

この記事は、https://juejin.cn/post/7003138257798037512

から転載されています。プログラミング関連の知識の詳細については、

プログラミング入門 を参照してください。 !

以上がuniapp およびミニ プログラムの下請け手順の詳細については、こちらをご覧ください。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はjuejin.cnで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。