ดาวน์โหลด shadcn extension - ดาวน์โหลดซอร์สโค้ด shadcn extension

shadcn extension

โค้ดแหล่งที่มา AI

v0.5.0

ดาวน์โหลด

Shadcn Extension Turborepo

นี่คือผู้เริ่มต้นอย่างเป็นทางการสำหรับ Shadcn Extension Turborepo การตั้งค่า monorepo สำหรับการพัฒนาและแบ่งปันส่วนประกอบ UI ที่นำกลับมาใช้ใหม่ได้

Turborepo คืออะไร?

TurborePo เป็นระบบบิลด์ประสิทธิภาพสูงสำหรับรหัสฐานจาวาสคริปต์และ typescript มันถูกออกแบบมาสำหรับการปรับขนาด monorepos และยังทำให้เวิร์กโฟลว์ในพื้นที่ทำงานแพคเกจเดี่ยวเร็วขึ้นเช่นกัน Turborepo เพิ่มประสิทธิภาพกระบวนการสร้างและพัฒนาโดยการแคชการดำเนินการแบบขนานและการวิเคราะห์กราฟการพึ่งพา

เกี่ยวกับที่เก็บนี้

ที่เก็บนี้เป็น monorepo ซึ่งหมายความว่ามีหลายโครงการที่จัดการใน codebase เดียว วิธีการนี้ช่วยลดความซับซ้อนของการจัดการการพึ่งพาและการแบ่งปันรหัสระหว่างโครงการ

เครื่องมือและเทคโนโลยีที่ใช้:

PNPM : ตัวจัดการแพ็คเกจแพ็คเกจที่รวดเร็วและรวดเร็วดิสก์
Turborepo : ระบบสร้างสำหรับ monorepos
TypeScript : Superset ที่พิมพ์แบบคงที่ของ JavaScript
Next.js : กรอบการตอบสนองสำหรับการผลิต

โครงสร้าง

ที่เก็บมีโครงสร้างดังนี้:

 shadcn-extension-turborepo/
├── apps/
│   └── extension/
│       ├── content/
│       │   └── docs/
│       ├── public/
│       │   ├── registry/
│       │   ├── next.svg
│       │   ├── og.png
│       │   └── vercel.svg
│       ├── src/
│       │   ├── __registry__/
│       │   ├── app/
│       │   ├── components/
│       │   ├── config/
│       │   ├── hooks/
│       │   ├── lib/
│       │   ├── registry/
│       │   ├── script/
│       │   ├── types/
│       │   └── env.ts
├── packages/
│   ├── CLI/
│   │   ├── src/
│   │   ├── __tests__/
│   │   ├── commands/
│   │   ├── utils/
│   │   └── index.ts
│   ├── eslint-config/
│   │   ├── library.js
│   │   ├── next.js
│   │   ├── package.json
│   │   ├── react-internal.js
│   │   └── README.md
│   └── typescript-config/
│       ├── base.json
│       ├── nextjs.json
│       ├── package.json
│       └── react-library.json
└── pnpm-workspace.yaml

เริ่มต้น

การโคลนนิ่งที่เก็บ

ก่อนอื่นให้โคลน monorepo ไปยังเครื่องในพื้นที่ของคุณ:

git clone https://github.com/BelkacemYerfa/shadcn-extension.git
cd shadcn-extension

การติดตั้ง

ติดตั้งการพึ่งพาทั้งหมดโดยใช้ pnpm :

pnpm install

การสร้างโครงการ

ในการสร้างแอพและแพ็คเกจทั้งหมดให้เรียกใช้คำสั่งต่อไปนี้:

pnpm build

สิ่งนี้จะรวบรวมรหัส TypeScript และเตรียมโครงการสำหรับการพัฒนาและการผลิต

การพัฒนา

ในการเริ่มต้นเซิร์ฟเวอร์การพัฒนาสำหรับแอพและแพ็คเกจทั้งหมดให้เรียกใช้:

pnpm dev

คำสั่งนี้จะเรียกใช้เซิร์ฟเวอร์การพัฒนาและดูการเปลี่ยนแปลงทำให้สามารถโหลดสดใหม่เพื่อประสบการณ์การพัฒนาที่ราบรื่นขึ้น

CLI

แพ็คเกจ @shadx/cli เป็นอินเตอร์เฟสบรรทัดคำสั่ง (CLI) สำหรับการเพิ่มส่วนประกอบในโครงการของคุณ ช่วยให้งานซ้ำ ๆ เป็นไปโดยอัตโนมัติเช่นการสร้างส่วนประกอบใหม่หรือการตั้งค่าการกำหนดค่า

คุณสามารถค้นหาคำแนะนำโดยละเอียดสำหรับการใช้ CLI ใน CLI ReadMe