stakit
v0.0.3
ชุดเครื่องมือแบบแยกส่วนสำหรับการสร้างเว็บไซต์แบบคงที่
Stakit เป็นเฟรมเวิร์กที่ช่วยให้คุณสร้างไปป์ไลน์การสร้างที่มีประสิทธิภาพสำหรับเว็บไซต์แบบคงที่โดยไม่ทำให้เหนื่อย มันเรียบง่ายและเป็นโมดูล ใช้สตรีมและชุดเครื่องมือ Stakit มีปลั๊กอินและการแปลงมากมายที่คุณสามารถใช้ได้
Stakit ยังอยู่ในช่วงเริ่มต้นของการพัฒนา แต่คุณสามารถนำไปใช้เพื่อดูว่าคุณควรสนใจมันหรือไม่
ผู้ไม่เชื่อเรื่องพระเจ้ากรอบงาน : ทำงานร่วมกับกรอบงานใด ๆ ที่สามารถส่งออกสตริงได้
โมดูลาร์ : คุณไม่เคยมีสิ่งที่คุณไม่ต้องการ แต่คุณสามารถ npm install
API ขนาดเล็ก : มีเพียง 7 วิธีหลักเท่านั้น คุณต้องใช้เพียง 3 วิธีเท่านั้น
ไม่มีข้อจำกัด : คุณจะไม่ถูกจำกัดด้วยฟีเจอร์และเทมเพลตของโปรแกรมสร้างไซต์คงที่
รวดเร็ว หน่วยความจำมีประสิทธิภาพ : ใช้สตรีมอย่างหนัก
npm i stakit
var stakit = ต้องการ('stakit')var { เรนเดอร์, ไฮเดรต } = ต้องการ('stakit-choo')var app = ต้องการ('.')var kit = stakit()
.routes (ฟังก์ชัน (สถานะ) {return [ '/' ]
-
.render(เรนเดอร์(แอป))
.transform (ไฮเดรต) kit.output (stakit.writeFiles ('./public'))โดยทั่วไป คุณจะทำ 2 สิ่งเมื่อสร้างไซต์แบบคงที่:
เติม เนื้อหา บางส่วนให้กับ แอป ของคุณ
คัดลอก ไฟล์ แบบคงที่
มีเครื่องมือแบบโมดูลาร์ (และน่ารัก) มากมายสำหรับการรวม Javascript หรือการแปลง CSS Stakit เป็นสิ่งที่คล้ายกัน แต่สำหรับไซต์เต็ม และเน้นไปที่ไฟล์ HTML โดยเฉพาะ
คุณจะต้องจัดการชุดรวมแอปของคุณและรวมชุดรวมด้วยหากนั่นคือสิ่งที่คุณต้องการ ตามปรัชญาของ Choo มันมีขนาดเล็ก เข้าใจได้ และใช้งานง่าย ได้รับการออกแบบมาเพื่อทำงานกับ Choo เป็นหลัก แต่ควรทำงานร่วมกับเฟรมเวิร์ก isomorphic อื่นๆ ด้วย
Stakit ถูกเรียกโดยทางโปรแกรม ไม่ใช่จากบรรทัดคำสั่ง ดังนั้น คุณจะต้องมีไฟล์ Javascript (เช่น build.js ) ในตำแหน่งที่คุณต้องการ หลังจากนั้นคุณสามารถเริ่มต้น kit ด้วย stakit() จากนั้นโยงวิธีการสองสามวิธี
ต้องมีสองวิธีในไปป์ไลน์:
routes(fn)
render(fn)
วิธีการอื่นทั้งหมดเป็นทางเลือกและเรียกตามลำดับต่อไปนี้:
มิดเดิลแวร์ทั้งหมดที่ใช้โดย kit.use()
ฟังก์ชัน routesReducer ที่ใช้
สำหรับทุกเส้นทาง:
การเรียกเพียงครั้งเดียวไปยัง renderer ที่ใช้
transform สายทั้งหมด
สิ้นสุดไปป์ไลน์ด้วย kit.output()
ส่วนนี้จะแสดงเอกสารเกี่ยวกับวิธีการทำงานแต่ละฟังก์ชันใน Stakit มีวัตถุประสงค์เพื่อเป็นข้อมูลอ้างอิงทางเทคนิค
kit = stakit() เริ่มต้นอินสแตน kit ใหม่
kit.html(template, selector)ตั้งค่าเทมเพลต HTML เริ่มต้นและตัวเลือก
kit.use(fn(context)) พุชมิดเดิลแวร์ / ปลั๊กอินไปยังรายการมิดเดิลแวร์ ฟังก์ชันวัตถุประสงค์ทั่วไปจะทำงานก่อนการสร้างเส้นทาง คุณสามารถแก้ไขบริบทตามที่คุณต้องการ ตั้งแต่การเปลี่ยน state ไปจนถึงการติดตั้ง transform
kit.use (ฟังก์ชั่น (ctx) {
ctx._transforms.push(แปลง)})ดูมิดเดิลแวร์สำหรับข้อมูลเพิ่มเติม
kit.routes(routeReducer(state)) routeReducer เป็นฟังก์ชันที่ได้รับ context.state เป็นพารามิเตอร์และส่งกลับ Array ของสตริง/เส้นทาง นี่คือเส้นทางที่ Stakit จะเรียกใช้ render
kit.routes (ฟังก์ชัน (สถานะ) {
กลับ Object.keys (state.content)
// หรือแบบคงที่
กลับ [ '/', '/เกี่ยวกับ', '/บล็อก' ]})kit.render(renderer(route, state)) ตั้งค่าตัวเรนเดอร์ของบิลด์ นี่คือจุดที่ความมหัศจรรย์เกิดขึ้น renderer จะถูกเรียกสำหรับทุกเส้นทางที่ส่งคืนโดย routes
จะต้องส่งคืนวัตถุด้วยค่าต่อไปนี้:
- html: string, // ผลลัพธ์ของการเรนเดอร์ state: object // สถานะหลังการเรนเดอร์ (ไม่บังคับ)}
การแปลงจะได้รับสถานะที่อัปเดตซึ่งส่งคืนที่นี่
kit.transform(transformFn, opts) พุชการแปลงไปยังรายการการแปลง Stakit ใช้ documentify และ streams เพื่อสร้าง HTML
สิ่งเหล่านี้ถูกเรียกหลังจากแทนที่เนื้อหาที่แสดงผลใน HTML แล้ว
ดูการแปลงสำหรับข้อมูลเพิ่มเติม
kit.output(writerObject) เริ่มต้น build ไปป์ไลน์และสิ้นสุดด้วยการส่งผ่านเส้นทางทั้งหมดไปยัง writerObject.write({ destination, stream }) ส่งคืน Promise ที่รอจนกว่าไฟล์ทั้งหมด (เส้นทางและสแตติก) จะถูกเขียนอย่างสมบูรณ์
ตามค่าเริ่มต้น จะใช้ Writer ที่ส่งออกไซต์ไปยังไดเร็กทอรี ./public public
ดูนักเขียนสำหรับข้อมูลเพิ่มเติม
มิดเดิลแวร์ในตัว:
stakit.state(extendState) ยูทิลิตี้ที่จะช่วยคุณในการเพิ่มค่าให้กับ context.state
kit.use(stakit.state({ ข้อความ: 'สวัสดีตอนเช้า!' }))stakit.copy(files)มิดเดิลแวร์สำหรับการคัดลอกไฟล์ไปยังไดเร็กทอรีเอาต์พุต
// คัดลอกไฟล์ไปยังตำแหน่งเดียวกัน kit.use(stakit.copy([ 'robots.txt' ]))// คัดลอกไฟล์ไปยังตำแหน่งอื่นภายในเอาต์พุต pathkit.use(stakit.copy({
'robots.txt': 'robots.txt',
'sitemap.xml': 'sitemaps/sitemap.xml'})) Documentify มีประสิทธิภาพมากและสามารถปรับได้อย่างง่ายดาย รูปแบบทั่วไปของการแปลง Stakit คือ:
// ห่อด้วย functionfunction lang (บริบท) {
// ส่งคืนการแปลงเอกสาร
ฟังก์ชั่น return (lang) {// ส่งคืนกระแสการแปลง ส่งคืน hstream ({ html: { lang: lang } })
- หมายเหตุ: hstream เป็นเพื่อนที่ดีมาก!
การแปลง documentify ถูกรวมไว้ในฟังก์ชัน ดังนั้นเราจึงสามารถรับ context เมื่อเราต้องการ โดยไม่ต้องยุ่งกับ API ของ documentify หากคุณต้องการหลีกเลี่ยงสิ่งนี้ คุณสามารถคืนค่าการแปลง documentify จากฟังก์ชันได้
ดูว่าการเปลี่ยนแปลงใดที่มาพร้อมกับ Stakit ใน transforms/readme.md
ผู้เขียนส่งออกไฟล์สแตติกที่สร้างขึ้นและแปลงแล้ว สิ่งนี้อาจแตกต่างกันไปตั้งแต่การส่งออกไปยังระบบไฟล์ไปจนถึงการใส่ลงในไฟล์เก็บถาวร Dat
ผู้เขียนจะต้องใช้วิธีการ: write . สำหรับทุกไฟล์ รวมถึงเพจที่สร้างขึ้น + ไฟล์ที่เพิ่มใน context._files , writer.write จะถูกเรียกพร้อมกับอ็อบเจ็กต์ไฟล์ ควรส่งคืน Promise ที่ส่งคืนหลังจากไปป์ถูกล้าง (ไฟล์ถูกเขียนอย่างสมบูรณ์)
วัตถุไฟล์มีลักษณะดังนี้:
{
source: null | string,
destination: string,
stream: Stream
}ขอแนะนำให้ล้างไดเร็กทอรีเอาต์พุตก่อนทุกบิลด์
ดูตัวอย่างเมธอด stakit.writeFiles ในตัว
นั่นคือทั้งหมดที่เกี่ยวกับนักเขียน
choo - เฟรมเวิร์กส่วนหน้าขนาด 4kb ที่แข็งแกร่ง
documentify - ตัวรวม HTML แบบโมดูลาร์
jalla - เว็บคอมไพเลอร์และเซิร์ฟเวอร์ที่รวดเร็วปานสายฟ้าในหนึ่งเดียว (ขอบคุณสำหรับข้อมูลโค้ดจำนวนมาก!)
