Vugu est une bibliothèque expérimentale pour les UIS Web écrite dans GO et ciblant WebAssembly. Guide et documents sur https://www.vugu.org. Godoc sur https://godoc.org/github.com/vugu/vugu.
Si vous avez toujours voulu écrire une interface utilisateur non pas dans JS mais Pure Go ... et l'exécutez dans votre navigateur, en ce moment ... que (expérimental;) Future est là!
Présentation de Vugu (prononcé /ˈvuː.ɡuː/), une bibliothèque inspirée de Vuejs dans GO Tipeting WasM.
Pas de nœud. Pas de js. Pas de npm. Aucun dossier Node_Modules en concurrence avec votre bibliothèque musicale pour l'espace disque.
Commencez: http://www.vugu.org/doc/start
Toujours un travail en cours, mais beaucoup de choses sont déjà fonctionnelles. Certains fonctionnent très bien.
Vous devez avoir GO V1.22.3 au minimum pour utiliser vugu . Nous avons besoin des changements de boucle pour l'introduction dans GO V1.22, et V1.22.3 a été le dernier à l'écriture du moment.
vugu pour les contributeurs vugu utilise désormais Mage pour gérer la construction des outils vugu - vugugen , vugufmt et vgfrom . Mage est également utilisé pour gérer le processus de test.
Veuillez consulter l'instruction de construction mise à jour dans le guide des contributeurs
Pour exécuter les exemples, vous devez installer l'outil mage , docker et goimports . vugu utilise mage pour gérer le processus de construction.
La façon la plus simple d'installer mage est:
git clone https://github.com/magefile/mage
cd mage
go run bootstrap.go
Vous devez exécuter mage à partir de la racine du module de vugu , c'est le répertoire où le niveau supérieur go.mod .
Vous aurez également besoin de l'outil goimports installé. Il est très probable que vous ayez déjà installé cela, normalement dans le cadre d'un plugin d'éditeur. Sinon, il peut être installé avec:
go install golang.org/x/tools/cmd/goimports@latest
Afin d'exécuter les exemples, vous aurez également besoin docker installé. Si docker n'est pas installé, suivez les instructions d'installation de Docker. Chaque exemple sera servi par un conteneur nginx local.
Tous les exemples sont dans le répertoire examples . Chaque sous-répertoire d' examples contient un seul exemple. Chaque exemple est son propre module Go.
Construire et servir tous les exemples est simple comme:
cd path/to/vugu
mage examples
ou
cd path/to/vugu
mage -v examples
Chaque exemple sera servi sur une URL de la forme
http://localhost:8888/<name-of-example-directory>
Par exemple, pour voir l'exemple fetch-and-display l'URL serait:
http://localhost:8888/fetch-and-display
Ou si vous souhaitez seulement exécuter un seul exemple, utilisez-vous:
cd path/to/vugu
mage singleExample <name-of-example-module>
Par exemple, pour servir uniquement l'exemple fetch-and-display la commande serait:
cd path/to/vugu
mage singleExample github.com/vugu/vugu/example/fetch-and-display
Si vous devez créer un nouvel exemple, le processus est assez simple. Le point critique est de le baser sur un exemple de travail.
Par exemple
cd /path/to/vugu
cp -r ./examples/fetch-and-display/ ./examples/my-new-example
Le cp copie tout dans le répertoire, y compris le fichier .gitignore local critique dans le nouvel exemple de répertoire. Veuillez faire en sorte que le .gitignore soit présent pour vous assurer que les fichiers générés par VUGU ne sont pas soumis au référentiel.
Vous devez ensuite modifier le ./examples/my-new-example/go.mod pour modifier le nom du module. Cette étape est critique.
Le nom du module doit être modifié pour correspondre à l'exemple, donc dans ce cas, le nom du module serait modifié en github.com/vugu/vugu/examples/my-new-example
Vous pouvez ensuite modifier le root.vugu , root.go au besoin pour prendre en charge l'exemple, ou ajouter plus de fichiers *.vugu et *.go si nécessaire.
Les fichiers main_wasm.go et wasm_exec.js ne doivent pas être modifiés.
Le fichier Exemples index.html devra être modifié à deux endroits distincts. Le premier est vers la ligne 11
<script src="/fetch-and-display/wasm_exec.js"></script>
Pour changer le chemin pour refléter le nom de l'exemple. Dans ce cas:
<script src="/my-new-example/wasm_exec.js"></script>
Le deuxième changement est similaire mais reflète le chemin du binaire de l'ouvrage main.wasm . Ceci est vers la ligne 29
WebAssembly.instantiateStreaming(fetch("/fetch-and-display/main.wasm"), go.importObject).then((result) => {
qui, dans ce cas, serait changé en:
WebAssembly.instantiateStreaming(fetch("/my-new-example/main.wasm"), go.importObject).then((result) => {
Le nouvel exemple peut ensuite être construit et servi avec:
cd /path/to/vugu
mage examples
Ou individuellement comme ceci:
cd /path/to/vugu
mage singleExample github.com/vugu/vugu/example/my-new-example
<tag :prop='expr'> . Il est construit plus comme une bibliothèque qu'un cadre . Bien que Vugu fasse la génération de code pour vos fichiers de composants .vugu, (et publiera même un Main_wasm.go par défaut pour un nouveau projet et construisez automatiquement votre programme lors de l'actualisation de la page), vous êtes toujours en contrôle. Le flux global du programme, le câblage et l'initialisation de l'application, la boucle de rendu qui maintient la page en synchronisation avec vos composants - vous avez un contrôle sur tout cela. Les cadres appellent votre code. Vugu est une bibliothèque, votre code l'appelle (même si Vugu génère un peu de cela pour vous au début pour vous faciliter les choses). L'un des principaux objectifs de Vugu, en ce qui concerne les développeurs qui le rencontrent pour la première fois, était de le rendre très rapide et facile à démarrer, mais sans imposer des limitations inutiles sur la structure d'un projet. Allez construire des outils (et maintenant le système de modules) est génial. L'idée est de tirer parti de cela dans la mesure la plus étendue possible, plutôt que de reprogrammer la roue.
Vous ne trouverez donc pas un outil de ligne de commande VUGU qui exécute un serveur de développement, vous trouverez plutôt dans les documents un extrait de code approprié que vous pouvez coller dans un fichier et go run vous-même. Pour la génération de code, bien qu'il y ait un http.handler qui peut le faire lors de l'actualisation de la page, vous pouvez également (et devriez!) Exécuter vugugen via go generate . Il existe de nombreuses petites décisions dans Vugu qui suivent cette philosophie: dans la mesure où il est raisonnablement possible, utilisez simplement le mécanisme existant au lieu d'inventer à nouveau. Et continuez à le faire jusqu'à ce qu'il y ait la preuve que quelque chose d'autre est vraiment nécessaire. Jusqu'à présent, cela a bien fonctionné. Et cela permet à Vugu de se concentrer sur les choses spécifiques qu'il apporte à la table.
Des exemples d'implémentations peuvent être trouvés dans des exemples de référentiels
Comme la plupart de votre code sera dans les fichiers .vugu , vous devrez installer des crédits VScode-Vugu va à @binhonglee.