vugu
1.0.0
Vugu es una biblioteca experimental para UIs web escrita en GO y apunta a WebAssembly. Guía y documentos en https://www.vugu.org. Godoc en https://godoc.org/github.com/vugu/vugu.
Si alguna vez has querido escribir una interfaz de usuario, no en JS sino pura ir ... y ejecutarla en tu navegador, ahora mismo ... ese (experimental;) ¡El futuro está aquí!
Introducción de Vugu (pronunciado /ˈvuː.ɡuː/), una biblioteca inspirada en Vuejs en GO apuntando a WASM.
Sin nodo. No JS. No NPM. No hay carpeta Node_Modules compitiendo con su biblioteca de música por el espacio de disco.
Comience: http://www.vugu.org/doc/start
Sigue siendo un trabajo en progreso, pero muchas cosas ya son funcionales. Algunos funcionan muy bien.
Debe tener V1.22.3 como mínimo para usar vugu . Requerimos los cambios para el bucle para que se introdujeron en GO V1.22, y V1.22.3 fue el último en el momento en que se escribió.
vugu para contribuyentes vugu ahora usa mago para administrar la compilación de las herramientas vugu - vugugen , vugufmt y vgfrom . Mago también se usa para administrar el proceso de prueba.
Consulte la instrucción de compilación actualizada en la Guía de contribuyentes
Para ejecutar los ejemplos, debe tener la herramienta mage , docker y goimports instalados. vugu utiliza mage para administrar el proceso de compilación.
La forma más sencilla de instalar mage es:
git clone https://github.com/magefile/mage
cd mage
go run bootstrap.go
Debe ejecutar mage desde la raíz del módulo de vugu , este es el directorio donde existe el nivel go.mod .
También necesitará instalada la herramienta goimports . Es muy probable que ya lo haya instalado, normalmente como parte de un complemento de editor. Si no, entonces se puede instalar con:
go install golang.org/x/tools/cmd/goimports@latest
Para ejecutar los ejemplos, también necesitará instalado docker . Si no tiene instalado docker , siga las instrucciones de instalación de Docker. Cada ejemplo será servido por un contenedor nginx local.
Todos los ejemplos están en el directorio de examples . Cada subdirectorio de examples contiene un solo ejemplo. Cada ejemplo es su propio módulo GO.
Construir y servir todos los ejemplos es simple como:
cd path/to/vugu
mage examples
o
cd path/to/vugu
mage -v examples
Cada ejemplo se servirá en una URL del formulario.
http://localhost:8888/<name-of-example-directory>
Por ejemplo, para ver el ejemplo fetch-and-display la url, la URL sería:
http://localhost:8888/fetch-and-display
O si solo desea ejecutar un solo ejemplo de uso:
cd path/to/vugu
mage singleExample <name-of-example-module>
Por ejemplo, para servir solo el ejemplo fetch-and-display el comando sería:
cd path/to/vugu
mage singleExample github.com/vugu/vugu/example/fetch-and-display
Si necesita crear un nuevo ejemplo, el proceso es bastante sencillo. El punto crítico es basarlo en un ejemplo de trabajo.
Por ejemplo
cd /path/to/vugu
cp -r ./examples/fetch-and-display/ ./examples/my-new-example
El cp copiará todo en el directorio, incluido el archivo .gitignore local crítico al nuevo directorio de ejemplo. Haga que el padre .gitignore esté presente para asegurarse de que los archivos generados por Vugu no se envíen al repositorio.
Luego debe editar el ./examples/my-new-example/go.mod para cambiar el nombre del módulo. Este paso es crítico.
El nombre del módulo debe cambiarse para que coincida con el ejemplo, por lo que en este caso el nombre del módulo se cambiaría a github.com/vugu/vugu/examples/my-new-example
Luego puede editar el root.vugu , root.go según sea necesario para admitir el ejemplo o agregar más archivos *.vugu y *.go según sea necesario.
Los archivos main_wasm.go y wasm_exec.js no deben editarse.
El archivo de ejemplos index.html deberá editado en dos lugares distintos. El primero es alrededor de la línea 11
<script src="/fetch-and-display/wasm_exec.js"></script>
Para cambiar la ruta para reflejar el nombre del ejemplo. En este caso:
<script src="/my-new-example/wasm_exec.js"></script>
El segundo cambio es similar pero refleja el camino del binario main.wasm . Esta es alrededor de la línea 29
WebAssembly.instantiateStreaming(fetch("/fetch-and-display/main.wasm"), go.importObject).then((result) => {
que en este caso se cambiaría a:
WebAssembly.instantiateStreaming(fetch("/my-new-example/main.wasm"), go.importObject).then((result) => {
El nuevo ejemplo se puede construir y servir con:
cd /path/to/vugu
mage examples
O individualmente como esto:
cd /path/to/vugu
mage singleExample github.com/vugu/vugu/example/my-new-example
<tag :prop='expr'> . Está construido más como una biblioteca que como un marco . Mientras que Vugu realiza la generación de código para sus archivos de componentes .vugu, (e incluso emitirá un Main_wasm predeterminado para un nuevo proyecto y crea su programa automáticamente en la actualización de la página), fundamentalmente todavía tiene el control. Flujo general del programa, cableado de aplicaciones e inicialización, el bucle de renderizado que mantiene la página en sincronización con sus componentes: tiene control sobre todo eso. Los marcos llaman a su código. Vugu es una biblioteca, su código lo llama (incluso si Vugu genera un poco de eso para usted al principio para facilitar las cosas). Uno de los objetivos principales para Vugu, cuando se trata de desarrolladores que lo encuentran por primera vez, era hacerlo muy rápido y fácil de comenzar, pero sin imponer limitaciones innecesarias sobre cómo se estructura un proyecto. Ir a construir herramientas (y ahora el sistema del módulo) es increíble. La idea es aprovechar eso en la mayor medida posible, en lugar de reprogramar la rueda.
Por lo tanto, no encontrará una herramienta de línea de comando Vugu que ejecute un servidor de desarrollo, sino que encontrará en los documentos un fragmento de código apropiado que puede pegar en un archivo y go run usted mismo. Para la generación de código, mientras que hay un http.handler que puede hacer esto en la actualización de la página, también puede (¡y debería hacerlo!) Ejecutar vugugen a través de go generate . Hay muchas decisiones pequeñas en Vugu que siguen esta filosofía: donde sea razonablemente posible, solo use el mecanismo existente en lugar de inventar de nuevo. Y sigue haciendo eso hasta que haya pruebas de que realmente se necesita algo más. Hasta ahora ha funcionado bien. Y le permite a Vugu concentrarse en las cosas específicas que trae a la mesa.
Se pueden encontrar ejemplos de implementaciones en repositorios de ejemplos
Como la mayor parte de su código estará en archivos .vugu , deberá instalar créditos VSCode-Vugu para @Binhonglee.
