Beta von Vue.js 3.0 lädt zum Probieren ein

Inhaltsverzeichnis

Laut Roadmap steht Ende Juni 2020 das Major Release der Version 3.0 des JavaScript-Frameworks Vue.js vor der Tür, als Vorgeschmack sollen Entwickler bereits jetzt die Betaversion an unkritischen Apps oder im abgesicherten Playground testen können.

Vue.js 3.0 soll ein neues Reactivity-System erhalten, eine Programmierschnittstelle für ein virtuelles DOM (Document Object Model) sowie schnellere Pfade durch geänderte Kompiliermethoden. Neben der Options-API soll eine neu vorgestellte Composition-API Entwicklern eine Reihe additiver, funktionsbasierter APIs anbieten, die sie laut Anbieter flexibel nach der Komponentenlogik ihrer Anwendungen zusammenstellen können. Die Codebasis von Vue.js 3.0 ist in TypeScript verfasst – mit automatisch generierten Typdefinitionen und einer API, die offenbar sowohl TypeScript als auch JavaScript unterstützt.

Kleinere Ausgabedateien durch Treeshaking

Neu ist wohl insbesondere das Treeshaking (Abwerfen nicht verwendeter Code-Bestandteile beim Export als Output-Datei), wodurch die Ausgabedateien kleiner ausfallen sollten als bislang: Zahlreiche optionale Vue-Funktionen wie die V-Model-Richtlinie erlauben nun das Abwerfen nicht benötigter Codebestandteile beim Exportieren. Das war in der alten Default-Exportmethode nicht möglich, schreibt ein Sprecher des Vue-Teams im Entwicklerblog, die Größe der Ausgabedateien soll sich dadurch deutlich reduzieren lassen. Das Hauptpaket von Vue verfügt deshalb nicht mehr über einen Default-Export, Nutzer müssen Exporte nun durch den Befehl createApp anstoßen.

Das Team hinter Vue hat offenbar auch die Komponentenlogik und den Aktualisierungsprozess überarbeitet. Eine Custom Renderer API soll Integration mit dem NativeScript-Framework bieten, und ein neues Feature namens Fragments (vom NativeScript-Herausgeber Telerik beschrieben als "Template Wrapper Tags") soll Entwicklern die Strukturierung einer Präsentation ermöglichen, ohne die Semantik zu beeinträchtigen. Das sei bei Problemen, die nur eine Stammkomponente zulassen, dienlich. Insgesamt listet das Projekt bei GitHub (in den Merged Requests for Changes) 24 größere Änderungen auf, davon sind 21 als Breaking Changes gekennzeichnet. Einsteigern legt das Vue-Team in einem Blogbeitrag nahe, direkt mit Version 3 zu beginnen.

Upgrade per Kommandozeile (CLI)

Das Upgrade kann offenbar mit einer Zeile Code erfolgen, den Weg über das offizielle Kommandozeilen-Interface (CLI) empfiehlt der Upgrade-Guide von Vue.js: vue add vue-next. Die Installation soll die Pakete vue, vueex, vue-router, eslint-plugin-vue und @vue/test-utilsauf die neue Hauptversion aktualisieren.

Nach erfolgter Aktualisierung taucht offenbar auch ein neues Paket namens @vie/compiler-sfc in den Abhängigkeiten auf. Es soll laut Anbieter die neuen Vue-Single-File-Komponenten zu ausführbarem JavaScript-Code kompilieren. Experimentierfreudige Entwickler können laut Migrationsleitfaden schon vor dem Erscheinen des Major Release ihre Anwendungen in Vue.js 3.0 austesten: Das Vue Next Plugin modifiziert wohl den Code älterer Projekte, damit er mit Version 3.x kompatibel ist.

Roadmap, Migrationsleitfaden und Playground zu Vue.js 3.0

Den Fahrplan zur Veröffentlichung können Interessierte auf GitHub einsehen, dort stehen auch Details zur letzten Version 2.7 des Entwicklungszweigs 2.x. Der JavaScript-Entwickler Gábor Soós hat für das Unternehmen Mitte Mai einen Upgrade-Guide zu Vue.js 3.0 veröffentlicht, der bei der Migration von Vue.js 2.x behilflich sein dürfte. Wer die neue Version zunächst in gesicherter Umgebung kennenlernten möchte, kann sie in einem Playground-Modus in der Code-Sandbox ausprobieren. Die vollständige Liste der Änderungen lässt sich im Bereich "Merged RFC" bei GitHub einsehen.

(sih)