J'utilise vscode directement comme éditeur (la même chose s'applique aux autres éditeurs, et j'utilise toujours les outils de développement WeChat pour la prévisualisation). Pour la coloration syntaxique, définissez wxml sur html et wxss sur css "files.associations": { "*.wxss": "css", "*.wxml": "html" } Vous pouvez également installer des plug-ins liés au mini programme pour commencer à écrire du code. Tout d'abord, vous devez lire la documentation du mini programme WeChat (framework, composants et API) dans son intégralité pour faciliter sa recherche lorsque vous l'utiliserez plus tard. Le composant view correspond à ptext en HTML et spanwxss. Le sélecteur prend uniquement en charge les éléments #id, .className, ::after, ::before. Créez de nouveaux composants dans le répertoire du projet de composant public et appuyez sur la structure de répertoires similaire aux pages <.>
1. Résumé d'un exemple du processus de développement de WeChat
Introduction : j'utilise l'éditeur directement vscode (la même chose s'applique aux autres éditeurs, nous utilisons toujours les outils de développement WeChat pour la prévisualisation), je définis wxml sur html pour la coloration syntaxique et je définis wxss sur css
2. Développement WeChat Introduction détaillée à WXML, WXSS et JS
Introduction : Cet article présente principalement l'introduction et les informations détaillées de l'applet WeChat WXML, WXSS et JS, les amis qui en ont besoin peuvent se référer à
3 Introduction au développement WeChat (7) Comment. utilisez weui.wxss
Introduction : Qu'est-ce que WeUI ? WeUI est conçu pour les mini-programmes par la conception officielle ? équipe conformément aux spécifications de conception visuelle WeChat Bibliothèque de styles de base personnalisée. Nous mettons ici WeUI dans les bases car WeUI est un produit officiel, et après la mise à jour de l'IDE du 28 octobre, l'IDE ne peut pas reconnaître et référencer les CSS, et il bloque également l'acquisition de fichiers de style depuis le réseau, traçant une ligne claire avec les CSS. .
4. Le mode de mise en page Flex est indispensable pour le développement de mini-programmes
Introduction : La disposition flexible est plus simple, plus rapide et plus pratique que la disposition flottante traditionnelle. La maîtrise de la mise en page Flex peut réduire le code wxss lors de la création de mini-programmes WeChat, et elle est également conforme aux exigences du document pour le développement des mini-programmes WeChat. Ce code implique quatre méthodes de mise en page Flex, chacune utilisant différents attributs de différents flex. Il est recommandé de lire la référence d'apprentissage à la fin de cet article pour connaître les attributs associés
5 Présentation d'un outil de développement tiers de mini-programme WeChat (WEPT)
Introduction : outil de développement d'applets WeChat, outil de développement tiers WEPT, fonction principale de WEPT : mise à jour en temps réel, prend en charge wxml wxss javascript json plus stable, contrairement aux outils officiels, il n'y a aucune restriction sur les erreurs fréquentes, pas besoin de se connecter à Internet, pas besoin de configurer CORS sur le backend et prend en charge la navigation mobile.
6.
Explication détaillée des fichiers wxml et wxss dans le mini-programme WeChat
Introduction : WXML WXML (WeiXin Markup Language) est un ensemble de langages de balises pour WeChat. Combiné avec des composants de base et des systèmes d'événements, il peut construire la structure de la page. (Petite Anna : Cela semble très puissant. Quels sont les composants de base et le système d'événements ? Cela semble encore plus puissant car ils doivent être combinés.) Les composants de base sont similaires aux balises en HTML, et le système d'événements est un événement en JavaScript qui peut gérer des réactions logiques à l'interface ; wxml n'est qu'un format de fichier. S'il n'y a pas de composants et d'événements, cela ne sert à rien.
. 7.
Vous apprendre à créer un calculateur d'applet Open source
Introduction : Il s'agit d'un petit projet de pratique pour novices (adapté sur la base de la démo rapide de WeChat) pour créer une calculatrice. Il possède une interface utilisateur de base, des sauts de base et une logique js simple, ce qui le rend très approprié pour les débutants. Lire le code des autres, c'est consolider vos propres compétences en programmation. Connaissances liées au développement d'applets WeChat : 1. Disposition CSS Flexbox 2. Liaison d'événements, saut de page 3. Page, fenêtre, paramètres globaux de l'application 4. Comment utiliser les fichiers wxml, wxsss, js, json 5. vue, texte, .. 8. Bases du développement de mini-programmes - Analyse de la page d'index (5) Introduction : Le tutoriel précédent parlait de certains problèmes techniques qui n'ont rien à voir avec le développement de l'applet WeChat lui-même. Revenons maintenant au sujet. Ce tutoriel explique principalement la page d'index générée par défaut. Comme indiqué dans le didacticiel précédent, chaque page contient trois fichiers : .js (logique de traitement), .wxml (décrivant le contenu de la page) et .wxss (configurant le style de la page). Il en va de même pour la page d'index. Avant d'expliquer, la page d'index dans l'image ci-dessus n'a pas beaucoup de contenu. Il n'y a qu'un avatar d'utilisateur, un nom d'utilisateur et "Hello World". Tout d'abord, jetons un œil à l'index.... 9. Aperçu de la structure des bases du développement du programme WeChat Mini (2)
Introduction : Tutoriel de développement de mini-programmes WeChat (bases) 1 Première introduction aux mini-programmes WeChat À la fin du didacticiel précédent, nous avons généré un mini-programme similaire à "Hello World" sans écrire une seule ligne de code dans le processus. Après avoir créé un nouveau projet, l'applet WeChat générera un cadre de programme par défaut et les travaux de développement de programme ultérieurs seront effectués sur ce cadre. Ce framework par défaut contient les parties suivantes : app.xx Chaque applet WeChat contiendra trois fichiers : app.js, app.json et app.wxss. Le fichier app.js... Explication détaillée de l'exemple de menu à tiroirs de développement d'applets WeChat Introduction : Le menu tiroir est une méthode de conception de menu courante sur les applications. Un menu tiroir typique est illustré dans la figure ci-dessous. Ce qui suit montre comment implémenter un menu tiroir basé sur l'applet WeChat. L'effet final est celui illustré dans la figure ci-dessous : La page contient une page d'accueil et une page de menu à tiroirs. Afin d'obtenir l'effet coulissant, la page adopte une mise en page absolue, le code est le suivant index.wxml index.wxss Le programme lie l'événement tactile et l'événement tap de la page d'accueil, et utilise catchtouchmove pour empêcher le transfert de l'événement de déplacement, car dans l'environnement réel de la machine, la page répondra automatiquement à la diapositive... 【Recommandations de questions et réponses associées】 : node.js - Lors du test de l'applet WeChat sur une machine réelle, la requête wx.request n'a renvoyé aucun résultat
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!