reactjs - האם ניתן להתקין Shadcn ui עבור Vite + React עם JavaScript ולא TypeScript?


אני נתקל בקשיים בהתקנה ושימוש ברכיבי shadcn בפרויקט vite + react + tailwind שלי. ניסיתי לעקוב אחרי המדריך בתיעוד שלהם כאן. נראה שזה דורש TypeScript כדי שזה יעבוד?

ניסיתי ל:

  1. צור פרויקט React Javascript עם Vite
  2. התקן את Tailwind עבור Vite React מהמסמך שלהם.
  3. עקוב אחרי מדריך shadcn במסמכים שלהם שלקשרתי למעלה.

זה אומר שהוא צריך את קובץ "tsconfig.json", שמשמעותו TypeScript. לאחר מכן ניסיתי שוב את הצעדים למעלה, אך במקום JavaScript יצרתי פרויקט TypeScript. אבל זה עדיין לא עבד, אני מקבל את השגיאה הזו כשאני מנסה להפעיל את השרת עם npm run dev: EISDIR: פעולה לא חוקית על תיקיה, קריאה

העליתי את קוד המקור ב-GitHub כאן

תשובה #1

אתה צריך ליצור את הקובץ בשם: "jsconfig.json" במקום "tsconfig.json".

בנוסף, עליך לוודא שהדגל "tsx" מוגדר כ- false, מכיוון שתשתמש ב-JavaScript. מקור התקנת shadcn

והקובץ tailwind.config.js שלך צריך לכלול את index.html בשדה התוכן יחד עם אחרים, כיוון שזהו שורש היישום של אפליקציות React ב-Vite. מקור התקנת Tailwind ב-Vite

תשובה #2

צור קובץ jsconfig.json בתיקיית השורש והדבק את התוכן שלמטה

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

עדכן את vite.config.js עם התוכן הבא

import { defineConfig } from "vite";
import path from "path";
import react from "@vitejs/plugin-react";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
    },
  },
});