ミナップ
WeChat ミニ プログラムの開発を再定義する
変更ログ
minapp 2.0.0 がリリースされました。新しいバージョンは主に webpack 4 を使用します。v1.x から v2.x へのアップグレードを確認してください。
導入
minapp は、開発エクスペリエンスを向上させるために WeChat ミニ プログラムを開発するために作成されたツールのセットです。
- コマンド ライン ツール
@minapp/cliを提供します。これを使用すると、プロジェクトを迅速に作成し、webpack を使用して生成されたプロジェクトをビルドできます。 - 開発フレームワーク
@minapp/coreを提供します。このフレームワークは、クラスを使用した開発をサポートし、自動コード補完をサポートし、すべての WeChat API の自動補完も提供します。 - mobx を統合するフレームワーク
@minapp/mobxを提供します。このフレームワークは主に mobx を@minapp/coreに挿入し、mobx を使用してグローバル データを簡単に管理できるようにします。 - vscode プラグイン
minapp-vscodeを提供します。このプラグインは主に小さなプログラム用のwxmlテンプレート言語であり、すべてのコンポーネント、コンポーネント属性、コンポーネント属性値などを自動的に補完できます。
注: minapp を使用した後も、テストのために WeChat が公式に提供する「WeChat 開発者ツール」を使用する必要があります。
使用
- npm を使用してコマンド ライン ツールをインストールします:
npm install -g @minapp/cli - プロジェクトを初期化します:
minapp init <你要创建项目的文件夹> (js プロジェクトと ts プロジェクトの同時作成をサポートします) - 2 つの vscode プラグインをインストールします: minapp と dot-template (オプションですが推奨)
特徴
- ネイティブ ミニ プログラムと完全な互換性があり、すべてのネイティブ ミニ プログラム コードを minapp 環境に直接移行できます。
- webpack と webpack-dev-server を統合して確実にコンパイルできるようにする
- グローバル データ管理を容易にするために mobx の使用を選択できます
- すべての言語は minapp 環境で自動的に完了でき、開発エクスペリエンスは非常に優れています (下記の
功能概览参照) - 双方向のデータバインディングをサポート
- setData パフォーマンスの最適化
機能概要 (vscode エディター下)
すべての wx インターフェイスには、インターフェイス パラメーターや戻り値を含むインテリジェントなリマインダーがあります。
minapp 以外のユーザーも@minapp/wxをインストールしてこの機能を利用できます。こちらを参照してください。
wx インターフェイス wxp の Promise バージョンを提供します。これは wx と同じですが、success/fail/complete の 3 つのパラメータを必要とする wx のすべての関数を Promise する点が異なります。
- wxp は成功コールバックの使用もサポートしています
- wxp は、Promise に Finally メソッドを追加します。たとえば、
wxp.getUserInfo().finally(() => { /* do something */ })を使用できます。
mobx を統合すると、グローバル データを変更し、現在のページのステータスを自動的に更新するのが非常に便利になります。
- Store を挿入するには、appify 関数に Store オブジェクトを追加するだけです。
- ストア オブジェクトはデフォルトでページとコンポーネントに挿入されます。これらを取得するには
this.storeを使用します。
wxml テンプレート言語は、構文の強調表示、コンポーネントのスマート プロンプト、コンポーネント属性のスマート プロンプトをサポートしています (vscode プラグイン minapp をインストールする必要があります)。
このプラグインの機能の詳細については、ここをクリックしてご覧ください。
json ファイルは自動プロンプトをサポートします
新しいページフォルダーを作成すると、関連ファイルが自動的に生成されます (vscode プラグイン dot-template をインストールする必要があります)
- js/json/wxml/scss などの関連ファイルが同じ名前で自動的に作成され、.dtpl フォルダー内でいつでもこれらのテンプレート ファイルを変更できます。
- 新しく作成されたページのパスを app.json フォルダーに自動的に挿入します
ミニ プログラム ページは自動関数プロンプトをサポートしています
同様に、新しいコンポーネント フォルダーを作成すると、関連ファイルも同時に作成され、コンポーネント内のライフ サイクル機能も自動的にプロンプトを表示します。
この倉庫の説明について
これは 1 つのプロジェクトではなく、lerna 開発ツールを使用した複数のプロジェクトの組み合わせです。他のプロジェクトはパッケージ ディレクトリにあります。いくつかの主要なプロジェクトの概要を次に示します。
- minapp-generator: このモジュールは、WeChat 公式文書を解析し、他のモジュールで使用する構造化データを生成する役割を果たします。
- minapp-wx: WeChat のすべてのネイティブ API の TypeScript 定義。また、wx インターフェースの Promise バージョンも提供します。
- minapp-core: 開発フレームワーク、minapp-wx に依存する必要があります
- minapp-mobx: mobx を統合し、minapp-core に依存する必要がある開発フレームワーク
- minapp-cli: ユーザーに提供され、新しいプロジェクトをすばやく作成できるコマンド ライン ツール
- minapp-vscode: vscode プラグイン。構文の強調表示、wxml のタグと属性の自動補完を提供します。
TODO
