zola vite demo

Demo Zola + Vite

Ini adalah demo kerja minimal yang menunjukkan bagaimana Anda dapat menghubungkan Zola dengan Vite dengan rapi tanpa plugin khusus.

• Zola adalah generator situs statis sederhana dan cerdas yang menggunakan mesin template Tera dengan sintaks mirip Jinja2/Twig.
• Vite adalah alat pembuatan frontend yang mirip dengan Webpack, tetapi lebih mudah dikonfigurasi.

Harap diperhatikan bahwa ini BUKAN proyek awal atau proyek boilerplate.

Dalam demo ini:

• Zola bertanggung jawab atas pemrosesan HTML, Vite bertanggung jawab atas pemrosesan JS dan SASS. Jika Anda lebih suka Zola memproses SASS daripada Vite, mengkonfigurasinya sangatlah mudah (lihat dokumen Zola dan komentar saya di main.js).
• Server pengembangan Zola dan Vite berjalan berdampingan.
• Reload panas berfungsi untuk kode HTML, JS, SASS.
• Perintah tersedia melalui npm run (lihat package.json).
• Build produksi diperkecil: Zola mengecilkan HTML, Vite mengecilkan JS dan CSS.

Cara menggunakan

1. Kloning repo dan cd ke dalam direktori.
2. Jalankan npm install untuk menginstal dependensi.
3. Jalankan npm run dev untuk menjalankan server dev Zola dan Vite.
4. Buka http://127.0.0.1:1111/ di browser Anda. Anda akan melihat halaman yang bertuliskan “Selamat datang di demo Zola + Vite” dan Hello world! di konsol browser (seperti pada gambar di atas).
5. Buat beberapa perubahan pada templates/index.html ATAU js/main.js ATAU sass/main.scss . Halaman di http://127.0.0.1:1111/ akan langsung diperbarui sesuai dengan perubahan yang Anda lakukan.
6. Jalankan npm run build to build untuk penggunaan produksi (file akan masuk ke direktori public/ ).

Masalah yang diketahui

1. Saya belum menguji demo di Windows.
2. Dokumen Vite mengatakan bahwa entrinya harus menyertakan import 'vite/modulepreload-polyfill' , tapi saya tidak begitu yakin tentang tujuannya (lihat main.js).
3. Jika http://localhost:3000/@vite/client memberi Anda 404, Anda harus membuka http://127.0.0.1:1111/ terlebih dahulu. Jika masih tidak berhasil, lihat ini.

Saran, pertanyaan?

Buka saja sebuah terbitan. Harap dicatat bahwa masalah yang tidak terkait dengan tujuan repositori ini akan ditandai sebagai ditutup.