WeChat Mini-Programmentwicklungsreihe (1) Detaillierte Erläuterung der Entwicklungsvorbereitungen

Dieser Artikel enthält eine detaillierte Erläuterung der WeChat Mini-Programmentwicklungsreihe (1) Entwicklungsvorbereitung

1: Entwicklungsvorbereitung

1 Registrieren Sie ein WeChat-Entwicklerkonto

Anmelden: https://mp.weixin.qq.com/ Registrieren.

Derzeit wird die Registrierung von WeChat-Miniprogrammkonten nur von Nicht-Einzelpersonen unterstützt Weitere Informationen finden Sie unter folgendem Link:

http://kf.qq.com/faq/140806zARbmm161103r6vmiA.html

Hinweis: Wenn Sie nur lernen möchten, wie man ein WeChat-Applet entwickelt, dann sind Sie hier genau richtig Sie können sich an diese Adresse wenden, um ein Testkonto zu registrieren:

2 WeChat Developer Tool herunterladen

Aufgrund der Überarbeitung der öffentlichen WeChat-Plattform können Sie es herunterladen WeChat kostenlos unter https://mp.weixin.qq.com/wiki Es gibt keine kleinen Programmentwicklungstools.

Sie müssen über ein WeChat-Applet-Entwicklungskonto verfügen und den QR-Code scannen, um das Entwicklungstool von der folgenden Website herunterzuladen.

https://mp.weixin.qq.com/debug/wxadoc/introduction/#Login

Wenn Sie außerdem nur die Entwicklung erlernen möchten, können Sie nach WeChat-Applet-Entwicklung suchen Tools auf Baidu und laden Sie sie nach Belieben herunter. Tools, die von Internetnutzern geteilt werden, können ebenfalls verwendet werden.

2: Einführung in die Verwendung von Entwicklungstools

1: Öffnen Sie das WeChat-Applet-Entwicklungstool (WeChat-Webentwicklertool) auf dem PC-Desktop, wie in Abbildung 1 dargestellt:

Abbildung 1

2: Scannen Sie mit WeChat den QR-Code in Abbildung 1, wie in Abbildung 2 gezeigt, und wählen Sie den ersten Punkt „Lokales Miniprogramm“ aus Projekt“, wie in Abbildung 3 dargestellt. (Wenn nun die Version des Entwicklungstools zu niedrig ist, wird beim Scannen ein Fehler gemeldet. Bitte aktualisieren Sie zuerst das Entwicklungstool. Das Entwicklungstool prüft automatisch die Version und aktualisiert automatisch.)

Abbildung 2

Abbildung 3

3: In Abbildung 3, wenn Sie zum ersten Mal ein Projekt erstellen , wählen Sie bitte „Projekt hinzufügen“, andernfalls wählen Sie ein bereits hinzugefügtes Projekt aus. Wählen Sie „Projekt hinzufügen“, wie in Abbildung 4 gezeigt.

Abbildung 4

4: Wenn es in Abbildung 4 nur zur Lernentwicklung dient, wählen Sie bitte „Keine AppID“ aus und füllen Sie es dann aus Geben Sie den Projektnamen ein, wählen Sie das Projektverzeichnis aus und klicken Sie auf die Schaltfläche „Projekt hinzufügen“. Rufen Sie wie in Abbildung 5 gezeigt die Hauptoberfläche des WeChat-Applet-Entwicklungstools auf.

Abbildung 5

5: Klicken Sie in Abbildung 5 in der oberen linken Ecke des Tools auf „Bearbeiten“, und das Tool wechselt in die Bearbeitungsmodusoberfläche , wie in Abbildung 6 gezeigt

Abbildung 6

6: Klicken Sie in Abbildung 5 in der oberen linken Ecke des Tools auf „Debuggen“ und die Das Tool wechselt in die Debug-Modus-Schnittstelle, wie in Abbildung 7 dargestellt

Abbildung 7

7: Klicken Sie in Abbildung 7 auf „Backstage“. In der unteren linken Ecke des Tools simuliert das Programm, dass das WeChat-Applet eingeht, wenn ein Anruf eingeht. Der Status des Hintergrunds ist in Abbildung 8 dargestellt

Abbildung 8
3: Projektverzeichnisstruktur

1: Öffnen Sie das WeChat-Applet-Entwicklungstool und rufen Sie den Bearbeitungsmodus auf, wie in Abbildung 1 unten gezeigt

Abbildung 9

1: Dieses Projekt besteht hauptsächlich aus Seiten/erster Seite, Seiten/Index, Seiten/Protokollen, bestehend aus mehreren Ordnern, die hauptsächlich die Schnittstelleninformationen des gesamten Miniprogramms beschreiben.

Jede Datei kann grundsätzlich unterteilt werden in: .js, .wxml, .wxss, .json und andere Dateien.

Zum Beispiel:

index.js: beschreibt die logischen Informationen der Indexseite (Analogie: js-Code)

index.wxml: beschreibt die Layoutinformationen des Index Seite (Analogie: HTML-Seitenlayout)

index.wxss: Stilinformationen, die das Layout der Indexseite beschreiben (Analogie: CSS-Informationen)

2: Gesamtinformationen zur Projektkonfiguration:

Besteht aus drei Dateien: app.js, app.json und app.wxss

app.json: Wie in Abbildung 1 gezeigt, beschreibt es die Seiteninformationen des gesamten Projekts (beschrieben durch „Seiten“), hauptsächlich den gesamten Hintergrund des Projekts, die Navigationsleiste und andere Stile Ist eine bestimmte Beschreibung vorhanden, werden die in „window“ beschriebenen Informationen in der .json-Datei überschrieben.

app.wxss: Beschreibt hauptsächlich den Gesamtstil des Projekts, wie in Abbildung 2 dargestellt

Abbildung 10

app .js: Beschreibt hauptsächlich die Eingabelogik des Projekts und beschreibt hauptsächlich einige Informationen nach der Benutzeranmeldung, wie in Abbildung 3 dargestellt

Abbildung 11

Das obige ist der detaillierte Inhalt vonWeChat Mini-Programmentwicklungsreihe (1) Detaillierte Erläuterung der Entwicklungsvorbereitungen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!