minapp
Redéfinir le développement des mini-programmes WeChat
Journal des modifications
minapp 2.0.0 a été publié. La nouvelle version utilise principalement le webpack 4. Veuillez vérifier la mise à niveau de la v1.x vers la v2.x.
introduire
minapp est un ensemble d'outils créés pour développer des mini-programmes WeChat afin d'améliorer l'expérience de développement :
- Fournit un outil de ligne de commande
@minapp/cli
, qui peut être utilisé pour créer rapidement un projet et utiliser webpack pour créer le projet généré ; - Fournissez un cadre de développement
@minapp/core
. Ce cadre est entièrement compatible avec le code d'applet natif. Il prend en charge le développement à l'aide de classes, prend en charge la complétion automatique du code et fournit également la complétion automatique de toutes les API WeChat. - Fournit un framework
@minapp/mobx
qui intègre mobx Ce framework injecte principalement mobx dans @minapp/core
, vous permettant d'utiliser facilement mobx pour gérer les données globales. - Fournissez un plug-in vscode
minapp-vscode
. Ce plug-in est principalement un langage de modèle wxml
pour les petits programmes. Il peut compléter automatiquement tous les composants, attributs de composants, valeurs d'attributs de composants, etc.
Remarque : après avoir utilisé minapp, vous devez toujours utiliser les « outils de développement WeChat » officiellement fournis par WeChat pour les tests.
utiliser
- Utilisez npm pour installer les outils de ligne de commande :
npm install -g @minapp/cli
- Initialisez le projet :
minapp init <你要创建项目的文件夹>
(prend en charge la création de projets js et ts en même temps) - Installez deux plug-ins vscode : minapp et dot-template (facultatif, mais recommandé)
Caractéristiques
- Entièrement compatible avec les mini-programmes natifs, tous les codes de mini-programmes natifs peuvent être directement migrés vers l'environnement minapp
- Intégrez webpack et webpack-dev-server pour assurer la compilation
- Vous pouvez choisir d'utiliser mobx pour faciliter la gestion globale des données
- Toutes les langues peuvent être automatiquement complétées dans l'environnement minapp et l'expérience de développement est super géniale (voir
功能概览
ci-dessous) - Prise en charge de la liaison de données bidirectionnelle
- Optimisation des performances de setData
Aperçu des fonctions (sous l'éditeur vscode)
Toutes les interfaces wx ont des rappels intelligents, y compris les paramètres d'interface et les valeurs de retour.
Les utilisateurs non-minapp peuvent également installer @minapp/wx
pour obtenir cette fonctionnalité, voir ici
Fournit une version promise de l'interface wx wxp, qui est la même que wx, sauf qu'elle promettra toutes les fonctions de wx qui nécessitent trois paramètres de succès/échec/complet
- wxp prend également en charge l'utilisation des rappels de réussite
- wxp ajoute une méthode enfin à Promise ; par exemple, vous pouvez utiliser
wxp.getUserInfo().finally(() => { /* do something */ })
L'intégration de mobx rend très pratique la modification des données globales et la mise à jour automatique de l'état actuel de la page.
- Pour injecter Store, il vous suffit d'ajouter l'objet Store dans la fonction appify.
- Les objets Store sont injectés dans Page et Component par défaut. Vous pouvez utiliser
this.store
pour les obtenir.
Le langage de modèle wxml prend en charge la coloration syntaxique, les invites intelligentes des composants et les invites intelligentes des attributs de composant (le minapp du plug-in vscode doit être installé)
Pour plus de détails sur les fonctions de ce plug-in, cliquez ici pour voir
le fichier json prend en charge les invites automatiques
Lors de la création d'un nouveau dossier de page, les fichiers associés sont automatiquement générés (le modèle de point du plug-in vscode doit être installé)
- Créez automatiquement des fichiers pertinents portant le même nom pour vous, notamment js/json/wxml/scss, et vous pouvez modifier ces fichiers modèles à tout moment dans le dossier .dtpl.
- Injectez automatiquement le chemin de la page nouvellement créé dans le dossier app.json
La page du mini programme prend en charge les invites de fonction automatiques
De la même manière, lors de la création d'un nouveau dossier de composant, les fichiers associés seront également créés en même temps, la fonction de cycle de vie du composant vous le demandera également automatiquement ;
À propos de cette description d'entrepôt
Ce n'est pas un projet, c'est une combinaison de plusieurs projets, utilisant l'outil de développement lerna. D'autres projets se trouvent dans le répertoire packages. Voici un bref aperçu de plusieurs des principaux projets.
- minapp-generator : ce module est chargé d'analyser les documents officiels de WeChat et de générer des données structurées destinées à être utilisées par d'autres modules.
- minapp-wx : définitions TypeScript de toutes les API natives de WeChat, et fournit également une version promise de l'interface wx
- minapp-core : framework de développement, doit dépendre de minapp-wx
- minapp-mobx : un framework de développement qui intègre mobx et doit s'appuyer sur minapp-core
- minapp-cli : Un outil de ligne de commande fourni aux utilisateurs et permettant de créer rapidement un nouveau projet
- minapp-vscode : plug-in vscode, fournissant la coloration syntaxique, la complétion automatique des balises et des attributs pour wxml
FAIRE