หน้าแรก>การเขียนโปรแกรมที่เกี่ยวข้อง>ส่วนประกอบของบุคคลที่สาม
ดาวน์โหลด

โครงการนี้อยู่ในขั้นทดลอง รู้สึกยินดีที่ได้ออกไปเที่ยวกับเราบน Discord หากคุณชอบโปรเจ็กต์นี้!

qwikcn

เช่นเดียวกับ shadcn/ui แต่สำหรับ Qwik ส่วนหนึ่งของ ? สแต็ค

เป้าหมายขององค์ประกอบนี้ ห้องสมุด คอลเลกชันคือการมีชุดส่วนประกอบที่นำมาใช้ซ้ำได้ชุดแรกที่สมบูรณ์และพร้อมสำหรับการผลิตสำหรับแอปพลิเคชัน Qwik พร้อมความสามารถในการคัดลอก/วาง a la shadcn เพื่อความสามารถในการปรับแต่งสูงสุด

นี่ไม่ใช่พอร์ต 100% การใช้ Qwik หมายความว่า qwikcn ต้องใช้ไลบรารี headless ที่เข้ากันได้กับ Qwik (hi qwik-ui และรูปแบบโมดูลาร์) ที่สามารถมี API ที่แตกต่างกันเล็กน้อยเมื่อเปรียบเทียบกับไลบรารี headless ของ shadcn (เช่น radix/ui หรือ react-hook-form) ด้วยเหตุนี้ ความเข้ากันได้จะถูกตั้งค่าไว้บนพื้นฐานที่ดีที่สุด แต่ฉันจะรักษาระบบการออกแบบพื้นฐานให้ใกล้เคียงที่สุด คุณสามารถคาดหวังความเท่าเทียมกัน 90%

ภายใต้ฝากระโปรง qwikcn ใช้การผสมผสานระหว่างส่วนประกอบ headless ของ qwik-ui, ส่วนประกอบ qwikiify$ed shadcn และองค์ประกอบ html ส่วนประกอบที่พร้อมสำหรับการผลิตยังมีไม่มากนักใน qwik-ui ดังนั้น qwikcn จะนำมาใช้เมื่อพร้อมสำหรับการผลิต ก่อนหน้านั้น ส่วนประกอบส่วนหัวของ shadcn ที่ซับซ้อนและไม่ได้ใช้บ่อยที่สุดจะเป็น qwikiify$ed แม้ว่าจะทำให้ประสิทธิภาพลดลงก็ตาม และสิ่งที่มีแนวโน้มที่จะนำมาใช้ซ้ำจำนวนมากจะทำหน้าที่เป็นองค์ประกอบ html แม้ว่านั่นอาจทำให้การเข้าถึงน้อยลงก็ตาม

มีส่วนร่วม

โปรดอ่านคู่มือการมีส่วนร่วม

ใบอนุญาต

ได้รับอนุญาตภายใต้ใบอนุญาต MIT

เครื่องมือสร้างไซต์แบบคงที่ (Node.js) 

pnpm build.server

เวอร์เซล เอดจ์

ไซต์เริ่มต้นนี้ได้รับการกำหนดค่าให้ปรับใช้กับฟังก์ชัน Vercel Edge ซึ่งหมายความว่าจะถูกเรนเดอร์ที่ตำแหน่ง Edge ใกล้กับผู้ใช้ของคุณ

การติดตั้ง

อะแดปเตอร์จะเพิ่ม vite.config.ts ใหม่ภายในไดเร็กทอรี adapters/ และไฟล์รายการใหม่จะถูกสร้างขึ้น เช่น: 

 └── adapters/
    └── vercel-edge/
        └── vite.config.ts
└── src/
    └── entry.vercel-edge.tsx

นอกจากนี้ ภายใน package.json สคริปต์ build.server จะได้รับการอัพเดตด้วย Vercel Edge build

การผลิตสร้าง

หากต้องการสร้างแอปพลิเคชันสำหรับการผลิต ให้ใช้คำสั่ง build คำสั่งนี้จะรัน pnpm build.server และ pnpm build.client โดยอัตโนมัติ : 

pnpm build

อ่านคู่มือฉบับเต็มได้ที่นี่

ปรับใช้ Dev

หากต้องการปรับใช้แอปพลิเคชันเพื่อการพัฒนา: 

pnpm deploy

โปรดสังเกตว่าคุณอาจต้องมีบัญชี Vercel เพื่อทำตามขั้นตอนนี้!

ปรับใช้การผลิต

โปรเจ็กต์พร้อมที่จะปรับใช้กับ Vercel แล้ว อย่างไรก็ตาม คุณจะต้องสร้างพื้นที่เก็บข้อมูล git และใส่โค้ดลงไป

คุณสามารถปรับใช้ไซต์ของคุณกับ Vercel ผ่านการผสานรวมผู้ให้บริการ Git หรือผ่าน Vercel CLI

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด