vugu
1.0.0
Vugu adalah perpustakaan eksperimental untuk Web UI yang ditulis dalam go dan menargetkan WebAssembly. Panduan dan dokumen di https://www.vugu.org. Godoc di https://godoc.org/github.com/vugu/vugu.
Jika Anda pernah ingin menulis UI bukan di JS tetapi Pure Go ... dan menjalankannya di browser Anda, sekarang ... itu (eksperimental;) Masa depan ada di sini!
Memperkenalkan Vugu (diucapkan /ˈvuː.ɡuː/), perpustakaan yang terinspirasi oleh Vuejs di WAS penargetan go.
Tidak ada simpul. Tidak JS. Tidak ada npm. Tidak ada folder node_modules yang bersaing dengan perpustakaan musik Anda untuk ruang disk.
Mulailah: http://www.vugu.org/doc/start
Masih dalam proses, tetapi banyak hal sudah fungsional. Beberapa bekerja dengan sangat baik.
Anda harus pergi v1.22.3 sebagai minimum untuk menggunakan vugu . Kami memerlukan perubahan loop yang diperkenalkan di GO V1.22, dan v1.22.3 adalah yang terakhir saat menulis.
vugu untuk Kontributor vugu sekarang menggunakan Mage untuk mengelola pembangunan alat vugu - vugugen , vugufmt dan vgfrom . Mage juga digunakan untuk mengelola proses pengujian.
Silakan lihat instruksi build yang diperbarui di panduan kontributor
Untuk menjalankan contoh, Anda harus menginstal alat mage , docker dan goimports . vugu menggunakan mage untuk mengelola proses pembangunan.
Cara paling sederhana untuk menginstal mage adalah:
git clone https://github.com/magefile/mage
cd mage
go run bootstrap.go
Anda harus menjalankan mage dari root modul vugu , ini adalah direktori tempat level go.mod ada.
Anda juga akan membutuhkan alat goimports yang diinstal. Sangat mungkin bahwa Anda sudah menginstal ini, biasanya sebagai bagian dari plugin editor. Jika tidak maka itu dapat diinstal dengan:
go install golang.org/x/tools/cmd/goimports@latest
Untuk menjalankan contoh, Anda juga perlu dipasang docker . Jika Anda tidak menginstal docker maka ikuti instruksi pemasangan Docker. Setiap contoh akan dilayani oleh wadah nginx lokal.
Semua contoh ada di direktori examples . Setiap sub-direktori examples berisi satu contoh. Setiap contoh adalah modul sendiri sendiri.
Membangun dan melayani semua contoh sederhana seperti:
cd path/to/vugu
mage examples
atau
cd path/to/vugu
mage -v examples
Setiap contoh akan disajikan di URL formulir
http://localhost:8888/<name-of-example-directory>
Misalnya untuk melihat contoh fetch-and-display URL akan:
http://localhost:8888/fetch-and-display
Atau jika Anda hanya ingin menjalankan satu contoh, gunakan:
cd path/to/vugu
mage singleExample <name-of-example-module>
Misalnya untuk melayani hanya contoh fetch-and-display perintahnya adalah:
cd path/to/vugu
mage singleExample github.com/vugu/vugu/example/fetch-and-display
Jika Anda perlu membuat contoh baru prosesnya cukup lurus ke depan. Titik kritisnya adalah mendasarkannya pada contoh yang berfungsi.
Misalnya
cd /path/to/vugu
cp -r ./examples/fetch-and-display/ ./examples/my-new-example
cp akan menyalin semua yang ada di direktori termasuk file .gitignore lokal yang kritis ke Direktori Contoh Baru. Harap jadikan sire .gitignore hadir untuk memastikan bahwa file yang dihasilkan Vugu tidak dikirimkan ke repositori.
Anda kemudian perlu mengedit ./examples/my-new-example/go.mod untuk mengubah nama modul. Langkah ini sangat penting.
Nama modul harus diubah agar sesuai dengan contoh, jadi dalam hal ini nama modul akan diubah menjadi github.com/vugu/vugu/examples/my-new-example
Anda kemudian dapat mengedit root.vugu , root.go sesuai kebutuhan untuk mendukung contoh, atau menambahkan lebih banyak file *.vugu dan *.go seperlunya.
File main_wasm.go dan wasm_exec.js tidak boleh diedit.
Contoh file index.html perlu diedit di dua tempat berbeda. Yang pertama adalah Circa Line 11
<script src="/fetch-and-display/wasm_exec.js"></script>
Untuk mengubah jalur untuk mencerminkan nama contoh. Dalam hal ini:
<script src="/my-new-example/wasm_exec.js"></script>
Perubahan kedua serupa tetapi mencerminkan jalur biner main.wasm . Ini adalah garis sekitar 29
WebAssembly.instantiateStreaming(fetch("/fetch-and-display/main.wasm"), go.importObject).then((result) => {
yang dalam hal ini akan diubah menjadi:
WebAssembly.instantiateStreaming(fetch("/my-new-example/main.wasm"), go.importObject).then((result) => {
Contoh baru kemudian dapat dibangun dan disajikan dengan:
cd /path/to/vugu
mage examples
Atau secara individual seperti ini:
cd /path/to/vugu
mage singleExample github.com/vugu/vugu/example/my-new-example
<tag :prop='expr'> . Ini dibangun lebih seperti perpustakaan daripada kerangka kerja . Sementara Vugu melakukan pembuatan kode untuk file komponen .vugu Anda, (dan bahkan akan menghasilkan Main_Wasm.wasm.go untuk proyek baru dan membangun program Anda secara otomatis di atas refresh halaman), pada dasarnya Anda masih terkendali. Aliran program secara keseluruhan, kabel aplikasi dan inisialisasi, render loop yang membuat halaman tetap sinkron dengan komponen Anda - Anda memiliki kontrol atas semua itu. Kerangka kerja hubungi kode Anda. Vugu adalah perpustakaan, kode Anda menyebutnya (bahkan jika Vugu menghasilkan sedikit untuk Anda di awal untuk membuat segalanya lebih mudah). Salah satu tujuan utama untuk Vugu, ketika datang ke pengembang pertama kali menemukannya, adalah membuatnya sangat cepat dan mudah untuk memulai, tetapi tanpa memaksakan keterbatasan yang tidak perlu pada bagaimana suatu proyek disusun. GO Build Tooling (dan sekarang sistem modul) luar biasa. Idenya adalah untuk memanfaatkannya sejauh mungkin, daripada memprogram ulang roda.
Jadi, Anda tidak akan menemukan alat baris perintah VUGU yang menjalankan server pengembangan, sebaliknya Anda akan menemukan di docs potongan kode yang sesuai yang dapat Anda tempel dalam file dan go run sendiri. Untuk pembuatan kode saat ada http.handler yang dapat melakukan ini di halaman refresh, Anda juga dapat (dan harus!) Menjalankan vugugen melalui go generate . Ada banyak keputusan kecil di Vugu yang mengikuti filosofi ini: ke mana pun memungkinkan, cukup gunakan mekanisme yang ada alih -alih menciptakan lagi. Dan terus lakukan itu sampai ada bukti bahwa hal lain benar -benar dibutuhkan. Sejauh ini bekerja dengan baik. Dan itu memungkinkan Vugu untuk fokus pada hal -hal spesifik yang dibawanya ke meja.
Contoh implementasi dapat ditemukan dalam contoh repositori
Karena sebagian besar kode Anda akan berada di file .vugu , Anda harus menginstal kredit vscode-vugu masuk ke @binhonglee.
