uni-app について
uni-appは、Vue.jsベースのクロスプラットフォームフレームワークで、モバイルOS、Web、多様なミニプログラム向けアプリを開発できます。このスキルはコンポーネント、API、設定、プラットフォーム別の実装を扱い、公式ドキュメント用MCPツールの利用も案内します。
主な機能
- 01iOS、Android、HarmonyOS、Web、ミニプログラムに対応
- 02ビュー、フォーム、メディア、ナビゲーションのコンポーネント
- 03ネットワーク、ストレージ、位置情報、システムAPI
- 04ページとアプリの設定
- 05プラットフォーム別の条件付きコンパイル
- 06MCPツールによる公式ドキュメント検索
活用シーン
- 01列挙された複数プラットフォーム向けアプリの開発
- 02対象間で共有するコンポーネントとAPIの利用
- 03プラットフォーム固有の動作の実装
- 04uni-appのAPIやコンポーネント資料の検索
MCP 対応
公式API資料や使用例の検索には、`search-docs-by-Uniapp-official` MCPツールを推奨しています。利用できない場合は、インストール先を案内します。
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/インストール後、Claude Code で/uni-appを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
GENERATION.mdreferences/config-manifest.mdconfig-pages.mdcore-form-components.mdcore-framework.mdcore-view-components.mdfeature-file-operations.mdfeature-lifecycle.mdfeature-location.mdfeature-media-components.mdfeature-navigation.mdfeature-network.mdfeature-storage.mdfeature-system-info.mdfeature-ui-feedback.md詳細
このスキルは uni-app のドキュメントに基づいており、2026-01-30 に生成されました。
uni-app は Vue.js ベースのクロスプラットフォームフレームワークで、iOS、Android、HarmonyOS、Web（レスポンシブ）、および各種ミニプログラムプラットフォーム（WeChat/Alipay/Baidu/Douyin/Feishu/QQ/Kuaishou/DingTalk/Taobao/Jingdong/Xiaohongshu）で動作するアプリケーションを開発できます。
コア
| トピック | 説明 | リファレンス |
|---|---|---|
| コアフレームワーク | プロジェクト構成、プラットフォームのサポート、条件コンパイル | core-framework |
| ビューコンポーネント | view、scroll-view、swiper、movable-area、cover-view | core-view-components |
| フォームコンポーネント | input、textarea、picker、checkbox、radio、switch、slider | core-form-components |
機能
UI コンポーネント
| トピック | 説明 | リファレンス |
|---|---|---|
| メディアコンポーネント | image、video、camera、live-player、map | feature-media-components |
| ナビゲーション | navigator、ルーティング、ページナビゲーション | feature-navigation |
| UI フィードバック | toast、modal、loading、アクションシート、プルリフレッシュ | feature-ui-feedback |
API
| トピック | 説明 | リファレンス |
|---|---|---|
| ネットワーク | HTTP リクエスト、ファイルのアップロード／ダウンロード、WebSocket | feature-network |
| ストレージ | ローカルストレージ、ファイルシステム、キャッシュ | feature-storage |
| システム情報 | デバイス情報、ネットワーク状態、画面、バイブレーション | feature-system-info |
| ファイル操作 | 画像／動画の選択、ファイルシステム操作 | feature-file-operations |
| 位置情報 | ジオロケーション、マップコンポーネント、住所の選択 | feature-location |
| ライフサイクル | アプリおよびページのライフサイクルフック | feature-lifecycle |
設定
| トピック | 説明 | リファレンス |
|---|---|---|
| pages.json | ページルーティング、タブバー、グローバルスタイル、サブパッケージ | config-pages |
| manifest.json | アプリ設定、権限、プラットフォーム設定 | config-manifest |
プラットフォームのサポート
| プラットフォーム | サポートレベル |
|---|---|
| iOS アプリ | 完全サポート |
| Android アプリ | 完全サポート |
| HarmonyOS Next | 完全サポート |
| H5/Web | 完全サポート |
| WeChat ミニプログラム | 完全サポート |
| Alipay ミニプログラム | 完全サポート |
| Baidu Smart Program | 完全サポート |
| Douyin ミニプログラム | 完全サポート |
| QQ ミニプログラム | 完全サポート |
| Kuaishou ミニプログラム | 完全サポート |
| Feishu ミニプログラム | 完全サポート |
| JD ミニプログラム | 完全サポート |
| HarmonyOS Meta Service | 完全サポート |
主要な概念
条件コンパイル
プラットフォーム固有のコードを記述するには、特別なコメントを使用します。
<view>App only</view>
<view>WeChat only</view>
API の Promise サポート
ほとんどの uni-app API は、コールバックを指定しない場合に Promise をサポートします。
const res = await uni.request({ url: 'https://api.example.com' })
クロスプラットフォーム開発のベストプラクティス
- プラットフォーム固有のものではなく、uni-app のコンポーネントと API を使用します
- プラットフォーム固有の機能には条件コンパイルを使用します
- すべての対象プラットフォームでテストします
- レスポンシブレイアウトには rpx を使用します
- manifest.json でプラットフォームの違いに対応します
- uni-helper ツールを必ず使用します
MCP 拡張機能
uni-app の公式ドキュメントを検索する必要がある場合は、まず search-docs-by-Uniapp-official MCP ツールを呼び出して、関連する API ドキュメントや使用例を検索してください。
使用シーン：
- ユーザーが特定の API の詳しい使い方を尋ねている場合
- 公式ドキュメントのコード例が必要な場合
- コンポーネントのプロパティやイベントを調べる場合
- API のプラットフォーム互換性を確認する場合
ツールのインストール： この MCP ツールが利用できない場合は、ユーザーに https://github.com/uni-helper/mcp からインストールするよう案内してください。