Hub documentation
Static HTML Spaces
Static HTML Spaces
Spaces juga mengakomodasi HTML kustom untuk aplikasi Anda alih-alih menggunakan Streamlit atau Gradio. Atur sdk: static di dalam blok YAML di bagian atas file README.md Spaces Anda. Kemudian, Anda dapat menempatkan kode HTML Anda di dalam file index.html.
Static Spaces gratis untuk semua orang: mereka disajikan secara langsung tanpa berjalan di compute, sehingga tidak seperti Gradio dan Docker Spaces, membuat mereka tidak pernah memerlukan paket berbayar.
Berikut adalah beberapa contoh Spaces yang menggunakan HTML kustom:
- NPC yang Lebih Cerdas: Tampilkan proyek PlayCanvas dengan iframe di Spaces.
- Huggingfab: Menampilkan model Sketchfab di Spaces.
- Diffuse the rest: Gambar dan diffuse bagian sisanya
Menambahkan langkah build sebelum menyajikan
Static Spaces mendukung penambahan langkah build kustom sebelum menyajikan aset statis Anda. Hal ini berguna untuk framework frontend seperti React, Svelte, dan Vue yang memerlukan proses build sebelum aplikasi disajikan. Perintah build dijalankan secara otomatis saat Space Anda diperbarui.
Tambahkan app_build_command di dalam blok YAML di bagian atas file README.md Spaces Anda, dan app_file.
Sebagai contoh:
app_build_command: npm run buildapp_file: dist/index.html
Contoh ruang:
Di balik layar, proses ini akan meluncurkan build, dengan menyimpan file yang dihasilkan di ref khusus refs/convert/build.
Variabel Space
variabel lingkungan kustom dapat diteruskan ke Space Anda. Informasi OAuth seperti client ID dan scope juga tersedia sebagai variabel lingkungan, jika Anda telah mengaktifkan OAuth untuk Space Anda.
Untuk menggunakan variabel-variabel ini di JavaScript, Anda dapat menggunakan objek window.huggingface.variables. Sebagai contoh, untuk mengakses variabel OAUTH_CLIENT_ID, Anda dapat menggunakan window.huggingface.variables.OAUTH_CLIENT_ID.
Berikut adalah contoh Space yang menggunakan variabel lingkungan kustom dan oauth yang diaktifkan serta menampilkan variabel dalam HTML:
Update on GitHub