Das WeChat-Applet überwacht weniger Dateien in Echtzeit und kompiliert sie in WXSS-Dateien, globale Befehlstools und Less-to-WXSS

hzc
Freigeben: 2020-06-15 11:13:58
nach vorne
3272 Leute haben es durchsucht

Der Technologie-Stack, den wir für unser WeChat-Miniprogrammprojekt ausgewählt haben, ist: natives + eingebettetes h5. An der Technologieauswahl ist nichts auszusetzen, aber ich denke, etwas ist seltsam. Für den gleichen Designentwurf ist die H5-Entwicklung normalerweise schneller als die Entwicklung kleiner Programme. Warum? Mini-Programme stellen viele gekapselte Komponenten bereit. Wir haben festgestellt, dass eine der Hauptursachen für das Problem darin liegt, dass die Verwendung von wxss bei der Entwicklung natürlich nicht beeinträchtigt wird . , es wird auch später schwieriger zu warten sein wxss.

Im vorherigen Leben war

zu langsam für die Entwicklung mit wxss , das nativ entwickelt wurde, und ich wollte nicht mehr wxss schreiben. Angesichts der Tatsache, dass WeChat-Miniprogramme schon so lange auf dem Markt sind, dass es ausgereifte Lösungen zur Lösung dieses Problems geben sollte, habe ich die folgenden Lösungen gefunden.

Option 1: Webstorm konfiguriert weniger automatische Kompilierung

Diese Lösung ist für Editor-Entwickler geeignet, die webstorm verwenden, aber ich bin jetzt verliebt in VSCode (bzw WeChat Developer-Tools, Sie müssen es immer noch zum Debuggen verwenden), und ich möchte webstorm nicht verwenden, also muss ich nach anderen Lösungen suchen.

Entwickler, die den Webstorm-Editor verwenden, können ihn gemäß dem folgenden Referenzartikel konfigurieren.

  • Webstorm-Konfiguration weniger wird automatisch kompiliert

  • Webstorm-weniger-Datei wird in die WXSS-Dateikonfiguration kompiliert

Option 2: Verwenden Sie gulp-less zum automatischen Kompilieren

Beziehen Sie sich auf den Aufgabenablauf von gulp, um die Aufgabe auszuführen , wird speziell zur Verarbeitung weniger Dateien verwendet. Die Ausgabe-CSS-Datei wird für die Verwendung in der Produktionsumgebung bereitgestellt. Diese Lösung kann verwendet werden, aber sie entspricht nicht ganz meinen Anforderungen. Ich bin faul und möchte sie nicht manuell kompilieren. Suchen und suchen Sie, um die nächste Lösung zu finden.

  • schlucklose Schluckverpackungsverarbeitung weniger

Option 3: wxss-cli: globale Befehlszeile + Pfad

Endlich eine ziemlich gute Lösung gefunden, wxss-cli, entwickelt von echo008. Führen Sie nach der globalen Installation dieses Tools wxss ./path aus, um weniger in wxss zu kompilieren. Nachdem ich es eine Woche lang verwendet hatte, stellte ich fest, dass ich jeden Tag, wenn ich zur Entwicklung ins Unternehmen ging, zuerst das Verzeichnis des zu kompilierenden Projekts kopieren musste. Und beim Kompilieren wird auch weniger in node_modules kompiliert. Dadurch wird die Kompilierung langsamer. Ich möchte nur unter den Seiten- und Komponentendateien in meinem Projektstammverzeichnis kompilieren. Gibt es eine Möglichkeit?

Keine dieser drei Optionen ist einfach zu verwenden...

Das WeChat-Applet überwacht weniger Dateien in Echtzeit und kompiliert sie in WXSS-Dateien, globale Befehlstools und Less-to-WXSS

Dieses Leben


Also habe ich Probleme mit dem Autor von wxss-cli angesprochen, aber der Autor hat mich nach einer Woche ignoriert.

Das WeChat-Applet überwacht weniger Dateien in Echtzeit und kompiliert sie in WXSS-Dateien, globale Befehlstools und Less-to-WXSS

Ich konnte nicht länger warten. Wenn es also nicht funktionierte, würde ich den Quellcode stehlen und ihn an meine Anforderungen anpassen. Welches Verzeichnis muss kompiliert werden less, in welchem ​​Dateiverzeichnis, führen Sie den Befehl  less-to-wxss watch zur Echtzeitüberwachung aus und konvertieren Sie weniger automatisch in eine wxss -Datei.

Das WeChat-Applet überwacht weniger Dateien in Echtzeit und kompiliert sie in WXSS-Dateien, globale Befehlstools und Less-to-WXSS

Es ist sehr einfach zu bedienen. Ich habe dem Autor erneut eine Ausgabe hinterlassen, aber er hat mich anscheinend auch ignoriert. Möglicherweise war der Autor zu beschäftigt, um sich darum zu kümmern. Schließlich unterstützt es die Ausführung der Less-to-WXSS-Überwachung in mehreren Terminals. Dieses Plug-in ist wirklich nützlich für native Entwickler kleiner Programme. Ein Plug-in ist frisch veröffentlicht. Holen Sie sich, was Sie brauchen. npm-Paket für Less-to-wxss

Less-to-wxss


Vorteile von Less-to-wxss :

  1. Keine Notwendigkeit, den Pfad zu übergeben

  2. Globale Installation, Kompilierung mit einem Klickless-to-wxss watch

  3. Selbstunterstützendes Multi-Terminal, Multi-Verzeichnis mit

verbessertem Implementierungsprinzip von less-to-wxss, indem Sie den Befehl eingeben, den aktuellen Standortpfad abrufen und ausführen Dateidurchlauf für die Dateien im geänderten Verzeichnis. Überwachen Sie, kompilieren Sie mit dem Less-Tool less in wxss, benennen Sie es um und speichern Sie es im ursprünglichen Verzeichnis. Die ursprüngliche Dateiaktualisierung wird mit dem oben beschriebenen Vorgang fortgesetzt.

Empfohlenes Tutorial: „WeChat Mini-Programm

Das obige ist der detaillierte Inhalt vonDas WeChat-Applet überwacht weniger Dateien in Echtzeit und kompiliert sie in WXSS-Dateien, globale Befehlstools und Less-to-WXSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:juejin.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage