uniapp とミニ プログラム (写真とテキスト) を下請けに出す方法を段階的に説明します。

WBOY
リリース: 2022-07-22 19:53:22
転載
2776 人が閲覧しました

この記事では、uniapp クロスドメインに関する関連知識を提供します。ユニアプリおよびミニ プログラムの下請けに関連する問題が紹介されています。下請けを使用する各ミニ プログラムには、メイン パッケージが含まれている必要があります。いわゆるメイン パッケージには、デフォルトのスタートアップ ページ/TabBar ページと、すべてのサブパッケージが使用する必要があるいくつかのパブリック リソース/JS スクリプトが配置されます。一方、サブパッケージは開発者の構成に従って分割されます。皆さんのお役に立てば幸いです。

uniapp とミニ プログラム (写真とテキスト) を下請けに出す方法を段階的に説明します。

推奨: 「uniapp チュートリアル

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

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

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

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

  • すべてのサブパッケージのサイズミニ プログラム全体のサイズは 2000 万個を超えてはなりません。
  • 単一のサブパッケージ/メイン パッケージのサイズは 2000 万個を超えることはできません。

ミニ プログラムを下請けに出すと、ミニ プログラムの最初の起動時に、複数のチームが一緒に開発するときに、より適切な分離とコラボレーションが可能になります。

ここをクリックすると、わかりやすい公式の下請けチュートリアルが表示されます。

2. Uniapp 下請けアプレット

App のデフォルトはパッケージ全体です。ミニプログラムの下請け構成にも対応。その目的はダウンロードを高速化することではなく、ホームページが vue の場合の起動を高速化することです。

#これは、アプレットを再委託した後のディレクトリ構造です。

#コンポーネント: パブリック コンポーネント (メイン パッケージによる参照用)
  • page_ に続くピンインはすべてサブパッケージです
  • サブパッケージ内のコンポーネントは、単一のサブパッケージのコンポーネント ディレクトリです。サブパッケージの vue ページの参照は、独自のページでのみ参照できます。 page_zhaoshang サブコントラクト ディレクトリ
  • pages はメイン パッケージで、スタートアップ ページ/TabBar ページが含まれます。
  • static にはパブリック静的リソースとピクチャ クラス
  • が含まれます。下請けの手順:

1.manifest.json の構成

"mp-weixin": {

"optimization":{"subPackages":true}

}
ログイン後にコピー

下請けの最適化:

対応するプラットフォーム (manifest.json) に、

"optimization":{"subPackages":true}

サブパッケージの最適化を有効にする現在は

mp-weixin

のみをサポートします、mp-qq mp-baidu の下請け最適化

静的ファイル: 下請けの static などの静的リソース、つまり静的リソースのコピーをサポートします。下請けディレクトリに配置されたファイルはメイン パッケージにはパッケージ化されず、
  • js ファイルはメイン パッケージでは使用できません。js が 1 つのサブパッケージによってのみ参照される場合、js はメイン パッケージ (つまり、メイン パッケージによって参照されるか、複数のサブパッケージによって参照される)
  • カスタム コンポーネント: カスタム コンポーネントが 1 つのサブパッケージによってのみ参照される場合-package であり、サブパッケージに配置されていない場合、コンパイル時にプロンプ​​ト メッセージが出力されます
  • 2.pages.json

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

注: メイン パッケージとサブパッケージを同じディレクトリに置くことはできません。uniapp プロジェクトを構築するときは、後の下請け用にディレクトリ構造を考慮することができます。

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

このステップは主に速度の最適化を目的として実行します。速度を最適化したくない場合は、この構成をスキップできます。

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

key

はページのパス、

value

はこのページに入る事前ダウンロード設定です。各設定には次の項目があります:

フィールドタイプ

必須デフォルト値# #packagesStringArrayYesNone ページに入った後にプリセット サブパッケージ化されたルートまたは名前をダウンロードします。 __APP__ はメインパッケージを表します。 networkStringNowifi指定されたネットワーク下での事前ダウンロード、オプションの値対象: すべて (ネットワークに限定されない)、Wi-Fi (Wi-Fi 環境下でのみ事前ダウンロード)

アプリの下請けも preloadRule をサポートしていますが、ネットワーク ルールは無効です。

例:

最後にクリックして uniapp 公式ドキュメントに入り、設定項目を表示します

推奨事項: "uniapp チュートリアル"

説明

以上がuniapp とミニ プログラム (写真とテキスト) を下請けに出す方法を段階的に説明します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:jb51.net
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!