uniappx-uview-pro

このスキルを使用するタイミング

ユーザーが次のことを希望する場合は、いつでもこのスキルを使用します。

• UniAppX プロジェクトに uView Pro を統合する
• uView Pro と連携するように UniAppX プロジェクトを設定する（pages.json、manifest.json、easycom）
• UniAppX で uView Pro を使用する際のプラットフォーム固有の動作に対応する（H5、ミニプログラム、App、nvue）
• uView Pro コンポーネントとともに UniAppX の機能（ナビゲーション、API、ライフサイクル）を使用する
• uView Pro コンポーネントを使ってクロスプラットフォームの UniAppX アプリケーションを構築する
• UniAppX で uView Pro コンポーネントを自動インポートするために easycom を設定する
• UniAppX で uView Pro を使ったナビゲーションとルーティングに対応する
• uView Pro を使用して UniAppX プロジェクトを最適化する
• uView Pro ベースの UniAppX アプリケーションを複数のプラットフォームにデプロイする

このスキルの使用方法

このスキルは、UniAppX の統合パターンと公式の UniAppX プラグイン構造（https://ext.dcloud.net.cn/plugin?id=24633）に沿って構成されています。UniAppX で uView Pro を使用する場合は、次の手順に従います。

1. インストールとセットアップ：UniAppX プロジェクトに uView Pro を導入します。

   • UniAppX へのインストールについては examples/getting-started/installation.md を読み込みます
   • UniAppX プロジェクトの設定については examples/getting-started/project-setup.md を読み込みます
   • easycom の設定については examples/getting-started/easycom-config.md を読み込みます

2. UniAppX の機能と統合します。

   • pages.json の設定については examples/integration/pages-config.md を読み込みます
   • manifest.json の設定については examples/integration/manifest-config.md を読み込みます
   • uView Pro を使ったナビゲーションについては examples/integration/navigation.md を読み込みます
   • uView Pro で UniAppX API を使用する方法については examples/integration/uniappx-api.md を読み込みます

3. プラットフォーム固有の動作に対応します。

   • H5 プラットフォームでの考慮事項については examples/platform-specific/h5.md を読み込みます
   • ミニプログラムでの考慮事項については examples/platform-specific/miniprogram.md を読み込みます
   • App プラットフォームでの考慮事項については examples/platform-specific/app.md を読み込みます
   • nvue での考慮事項については examples/platform-specific/nvue.md を読み込みます

4. 高度な統合：

   • UniAppX でのテーマのカスタマイズについては examples/advanced/custom-theme.md を読み込みます
   • ビルドの最適化については examples/advanced/build-optimization.md を読み込みます
   • マルチプラットフォームへのデプロイについては examples/advanced/multi-platform.md を読み込みます

5. 必要に応じて API ドキュメントを参照します。

   • api/integration-api.md - UniAppX と uView Pro の統合 API
   • api/config-api.md - 設定 API リファレンス

6. クイックスタートにはテンプレートを使用します。

   • templates/basic-uniappx-project.md - uView Pro を使った基本的な UniAppX プロジェクト
   • templates/pages-template.md - ページ設定テンプレート
   • templates/manifest-template.md - マニフェスト設定テンプレート

重要な注意事項：

• このスキルの対象は UniAppX との統合であり、uView Pro の API ドキュメントではありません
• UniAppX は TypeScript（.uts ファイル）と Composition API（setup 構文）を使用します
• コンポーネントを自動インポートできるよう、必ず pages.json で easycom を設定してください
• プラットフォーム固有のコードには条件付きコンパイル（#ifdef、#endif）を使用してください
• デプロイ前にすべての対象プラットフォーム（H5、ミニプログラム、App）でテストしてください
• UniAppX でレスポンシブなサイズ指定を行うには rpx 単位を使用してください

例とテンプレート

はじめに

• インストール：examples/getting-started/installation.md - UniAppX プロジェクトに uView Pro をインストールする方法
• プロジェクトのセットアップ：examples/getting-started/project-setup.md - uView Pro を使った UniAppX プロジェクトのセットアップ
• Easycom の設定：examples/getting-started/easycom-config.md - コンポーネントを自動インポートするための easycom の設定

統合

• ページ設定：examples/integration/pages-config.md - uView Pro を使った pages.json の設定
• マニフェストの設定：examples/integration/manifest-config.md - uView Pro 用の manifest.json の設定
• ナビゲーション：examples/integration/navigation.md - uView Pro を使ったナビゲーションとルーティング
• UniAppX API：examples/integration/uniappx-api.md - uView Pro コンポーネントで UniAppX API を使用する方法

プラットフォーム固有

• H5：examples/platform-specific/h5.md - uView Pro を使用する際の H5 プラットフォームに関する考慮事項
• ミニプログラム：examples/platform-specific/miniprogram.md - uView Pro を使用する際のミニプログラムに関する考慮事項
• アプリ：examples/platform-specific/app.md - uView Pro を使用する際のアプリプラットフォームに関する考慮事項
• nvue：examples/platform-specific/nvue.md - uView Pro を使用する際の nvue に関する考慮事項

高度な設定

• カスタムテーマ：examples/advanced/custom-theme.md - UniAppX プロジェクトでのテーマのカスタマイズ
• ビルドの最適化：examples/advanced/build-optimization.md - uView Pro を使用した UniAppX ビルドの最適化
• マルチプラットフォーム：examples/advanced/multi-platform.md - マルチプラットフォームのデプロイ戦略

テンプレート

• 基本プロジェクト：templates/basic-uniappx-project.md - uView Pro を使用する UniAppX プロジェクトの基本構成
• ページテンプレート：templates/pages-template.md - pages.json 設定テンプレート
• マニフェストテンプレート：templates/manifest-template.md - manifest.json 設定テンプレート

API リファレンス

• 統合 API：api/integration-api.md - UniAppX と uView Pro の統合 API リファレンス
• 設定 API：api/config-api.md - UniAppX プロジェクト向けの設定 API リファレンス

ベストプラクティス

1. easycom を使用する：pages.json で easycom を設定し、uView Pro コンポーネントを自動的にインポートします
2. プラットフォームテスト：デプロイ前に、対象となるすべてのプラットフォーム（H5、ミニプログラム、アプリ）でテストします
3. rpx 単位を使用する：UniAppX ではレスポンシブなサイズ指定に rpx を、固定サイズには px を使用します
4. SCSS サポート：UniAppX プロジェクトで SCSS が適切に設定されていることを確認します
5. マニフェストの設定：各プラットフォームに合わせて manifest.json を適切に設定します
6. 条件付きコンパイル：プラットフォーム固有のコードには条件付きコンパイル（#ifdef、#endif）を使用します
7. パフォーマンス：各プラットフォーム固有の要件に合わせて最適化します
8. TypeScript：TypeScript（.uts ファイル）と適切な型定義を使用します
9. Composition API：Composition API と setup 構文を使用します（UniAppX で推奨）
10. ライフサイクル管理：uView Pro コンポーネントを使用する際は、UniAppX のページライフサイクルを適切に処理します

リソース

• UniAppX 公式プラグイン：https://ext.dcloud.net.cn/plugin?id=24633
• UniAppX ドキュメント：https://uniapp.dcloud.net.cn/uni-app-x/
• UniAppX API リファレンス：https://uniapp.dcloud.net.cn/uni-app-x/api/

キーワード

uniappx, uniapp-x, uview-pro, uview pro, uniappx 統合, uniappx 設定, easycom, pages.json, manifest.json, uni-app-x, ミニプログラム, クロスプラットフォーム, H5, アプリ, nvue, 条件付きコンパイル, プラットフォーム間の差異, TypeScript, Composition API, setup 構文, .uts ファイル, UniAppX コンポーネント, クロスプラットフォームコンポーネント, ミニプログラムコンポーネント, アプリコンポーネント