Toolkit modular untuk membangun situs web statis
Stakit adalah kerangka kerja yang membantu Anda menyusun pipeline build yang kuat untuk situs web statis tanpa bersusah payah. Ini minimal dan modular, menggunakan aliran dan toolkit Stakit memiliki banyak plugin dan transformasi yang dapat Anda gunakan.
Stakit masih dalam tahap awal pengembangan, tetapi Anda dapat mengambilnya dan menggunakannya untuk melihat apakah Anda harus peduli atau tidak.
framework agnostic : bekerja dengan framework apa pun yang dapat menghasilkan string
modular : Anda tidak pernah memiliki apa yang tidak Anda perlukan, tetapi Anda dapat npm install
api kecil : hanya memiliki 7 metode inti, hanya 3 yang harus Anda gunakan
tanpa batasan : Anda tidak pernah dibatasi oleh fitur dan templat generator situs statis
cepat, hemat memori : banyak menggunakan aliran
npm i stakit
var stakit = memerlukan('stakit')var { render, hidrat } = memerlukan('stakit-choo')var app = memerlukan('.')var kit = stakit() .routes(fungsi (status) {kembali [ '/' ] }) .render(render(aplikasi)) .transform(hidrat)kit.output(stakit.writeFiles('./public'))
Umumnya, Anda melakukan 2 hal saat membuat situs statis:
isi aplikasi Anda dengan beberapa konten
salin file statis
Ada banyak alat modular (dan bagus) untuk menggabungkan Javascript atau mengubah CSS, Stakit adalah sesuatu yang serupa, tetapi untuk situs lengkapnya, dan terutama berfokus pada file HTML.
Anda harus menangani bundling aplikasi Anda dan menyertakan bundle tersebut jika itu yang Anda perlukan. Mengikuti filosofi Choo, ukurannya kecil, mudah dimengerti, dan mudah digunakan. Ini dirancang untuk bekerja terutama dengan Choo, tetapi juga harus bekerja dengan kerangka isomorfik lainnya.
Stakit dipanggil secara terprogram, bukan dari baris perintah, oleh karena itu Anda memerlukan file Javascript (seperti build.js
), jika Anda memerlukannya. Setelah itu Anda dapat menginisialisasi kit dengan stakit()
dan kemudian merangkai beberapa metode.
Dua metode harus muncul dalam pipeline:
routes(fn)
render(fn)
Semua metode lainnya bersifat opsional dan dipanggil dalam urutan berikut:
semua middleware diterapkan oleh kit.use()
fungsi routesReducer
yang diterapkan
untuk setiap rute:
satu panggilan ke renderer
yang diterapkan
semua panggilan transform
Akhiri alur dengan kit.output()
.
Bagian ini memberikan dokumentasi tentang cara kerja setiap fungsi di Stakit. Ini dimaksudkan sebagai referensi teknis.
kit = stakit()
Inisialisasi instance kit
baru.
kit.html(template, selector)
Mengatur templat dan pemilih HTML awal.
kit.use(fn(context))
Mendorong middleware/plugin ke daftar middleware, fungsi tujuan umum dijalankan sebelum pembuatan rute. Anda dapat mengubah konteks sesuka Anda, mulai dari mengubah state
hingga menginstal transform
s.
kit.menggunakan(fungsi (ctx) { ctx._transforms.push(transformasi)})
Lihat Middlewares untuk informasi lebih lanjut.
kit.routes(routeReducer(state))
routeReducer
adalah fungsi yang mendapatkan context.state
sebagai parameter dan mengembalikan Array
string/rute. Ini adalah rute yang akan dipanggil Stakit render
.
kit.routes(fungsi (status) { kembalikan Objek.kunci(status.konten) // atau secara statis kembali [ '/', '/tentang', '/blog' ]})
kit.render(renderer(route, state))
Menyetel penyaji build. Di sinilah keajaiban terjadi. renderer
akan dipanggil untuk setiap rute yang dikembalikan oleh routes
.
Itu harus mengembalikan objek dengan nilai berikut:
{ html: string, // hasil render state: object // keadaan setelah render (opsional)}
Transformasi akan menerima status terbaru yang dikembalikan di sini.
kit.transform(transformFn, opts)
Mendorong transformasi ke daftar transformasi. Stakit menggunakan documentify
dan stream untuk membangun HTML.
Mereka dipanggil setelah konten yang dirender diganti dalam HTML.
Lihat Transformasi untuk informasi lebih lanjut.
kit.output(writerObject)
Memulai alur pembangunan dan mengakhirinya dengan meneruskan semua rute ke writerObject.write({ destination, stream })
. Mengembalikan Promise
yang menunggu hingga semua file (rute dan statis) telah ditulis sepenuhnya.
Secara default, ia menggunakan Writer yang menampilkan situs ke direktori ./public
.
Lihat Penulis untuk informasi lebih lanjut.
Middleware bawaan:
stakit.state(extendState)
Utilitas untuk membantu Anda menambahkan nilai ke context.state
kit.use(stakit.state({ pesan: 'selamat pagi!' }))
stakit.copy(files)
Middleware untuk menyalin file ke direktori keluaran.
// Salin file ke locationkit.use(stakit.copy([ 'robots.txt' ])) yang sama// Salin file ke lokasi berbeda dalam output pathkit.use(stakit.copy({ 'robots.txt': 'robots.txt', 'peta situs.xml': 'peta situs/peta situs.xml'}))
Documentify
sangat kuat dan dapat dengan mudah dimodulasi. Format umum transformasi Stakit adalah:
// dibungkus dalam suatu fungsifungsi lang (konteks) { // mengembalikan transformasi dokumentasi return function (lang) {// mengembalikan aliran transformasireturn hstream({ html: { lang: lang } }) }}
Catatan: hstream
adalah teman yang sangat baik!
Transformasi documentify
dibungkus dalam sebuah fungsi, sehingga kita bisa mendapatkan context
saat kita membutuhkannya, tanpa mengacaukan API documentify
. Jika Anda ingin melewati ini, Anda cukup mengembalikan transformasi documentify
dari suatu fungsi.
Lihat transformasi apa yang disertakan dengan Stakit di transforms/readme.md
.
Penulis mengeluarkan file statis yang dihasilkan dan diubah. Hal ini dapat bervariasi mulai dari keluaran ke sistem file, hingga memasukkannya ke dalam arsip Dat.
Seorang penulis harus menerapkan metode: write
. Untuk setiap file, termasuk halaman yang dihasilkan + file yang ditambahkan ke context._files
, writer.write
akan dipanggil dengan objek file. Ini harus mengembalikan Promise
yang kembali setelah pipa dibilas (file telah ditulis sepenuhnya).
Objek file terlihat seperti ini:
{ source: null | string, destination: string, stream: Stream }
Disarankan untuk membersihkan direktori keluaran sebelum setiap build.
Lihat metode stakit.writeFiles
bawaan sebagai contoh.
Itu semua tentang penulis.
choo - kerangka frontend 4kb yang kokoh
mendokumentasikan - Bundel HTML modular
jalla - Kompiler dan server web secepat kilat dalam satu kesatuan (terima kasih juga atas banyak cuplikan kodenya!)