ミニプログラム開発
MiniDev Studio のミニプログラム開発には、独立した 2 つの機能ラインがあります。まずこの違いを押さえてください。
| 機能ライン | 何か | 形態 | 使い方 |
|---|---|---|---|
Web UI コンポーネント（minidev-components） | m-* のビジュアルコンポーネント（ボタン、入力欄、スワイパー…） | Web Components タグ | テンプレートに直接 <m-button> と書く。import / 登録は不要 |
Bridge SDK（mini-sdk） | ネイティブ機能を呼び出す JS API（Toast、ルーティング、ストレージ、デバイス…） | mini.* 関数 | import mini from 'mini-sdk' してから mini.showToast() を呼ぶ |
一言で言うと、画面を作るには
m-*タグ、機能を呼ぶにはmini.*関数。 両者は互いに依存しません。
デザインと規約
- デザイン言語：Material Design 3（MD3）。カラー、角丸、タイポグラフィ、モーションのトークンを一式内蔵しています。
- フレームワーク非依存：Vue、React、素の HTML は同じ書き方で、コンポーネントのイベントデータは常に
e.detailにまとめられます。 - サイズ単位：
rpx（レスポンシブピクセル、750rpx = 画面幅）に対応し、コンパイル時に自動換算して各種画面に適応します。
コンポーネント · Web UI
- 基本：View · Text · Icon · Image · Button · Divider
- フォーム：Input · Textarea · Switch · Slider · Picker · Radio · Checkbox · Label · Form
- レイアウト：Main · ScrollView · Swiper
- 表示：Progress · Circle · Loading · Skeleton · Steps · Collapse · Video
- フィードバック：Popup · Calendar · Cascader
Bridge SDK
- UI とインタラクション：UI コントロール · Lifecycle
- データとデバイス：Storage · Clipboard · Device · Network
- アプリと業務：Router · App · Auth · Analytics · Vehicle · Component · Map
応用ガイド
ランタイムモデル · 呼び出しスタイルと環境判定 · エラーハンドリング · ローカル Mock · app.json 設定
初めての方は クイックスタート から始めることをおすすめします。