shadcn-ui / ui

Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.
https://ui.shadcn.com
MIT License
73.49k stars 4.52k forks source link

[bug]: Validation failed: - resolvedPaths: Required,Required,Required,Required,Required #4737

Open ravenkim opened 1 month ago

ravenkim commented 1 month ago

Describe the bug

when I init

✔ Preflight checks. ✔ Verifying framework. Found Vite. ✔ Validating Tailwind CSS. ✔ Validating import alias.

Something went wrong. Please check the error below for more details. If the problem persists, please open an issue on GitHub.

Validation failed:


image

Affected component/components

init

How to reproduce

  1. yarn 4.4
  2. vite
  3. js

Codesandbox/StackBlitz link

No response

Logs

No response

System Info

{
  "packageManager": "yarn@4.4.1",
  "name": "boilerplate_fe",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "lint": "eslint .",
    "preview": "vite preview"
  },
  "dependencies": {
    "react": "^18.3.1",
    "react-dom": "^18.3.1"
  },
  "devDependencies": {
    "@eslint/js": "^9.9.0",
    "@types/node": "^22.5.3",
    "@types/react": "^18.3.3",
    "@types/react-dom": "^18.3.0",
    "@vitejs/plugin-react-swc": "^3.5.0",
    "autoprefixer": "^10.4.20",
    "eslint": "^9.9.0",
    "eslint-plugin-react": "^7.35.0",
    "eslint-plugin-react-hooks": "^5.1.0-rc.0",
    "eslint-plugin-react-refresh": "^0.4.9",
    "globals": "^15.9.0",
    "postcss": "^8.4.44",
    "tailwindcss": "^3.4.10",
    "vite": "^5.4.1"
  }
}

Before submitting

shadcn commented 1 month ago

@ravenkim is this a new vite project with react?

ravenkim commented 1 month ago

@shadcn i got two project in new one and old one have same problem

with react vite

ravenkim commented 1 month ago

in recent project

in recent project , when i pull new component

everything works well except

cn path

every {cn} path in new components looks like

import { cn } from "s/lib/utils"

it worked well before like

import { cn } from "src/assets/shadcn/utils"

i have utils in aliases

    "aliases": {
        "components": "./src/assets/shadcn/components",
        "utils": "./src/assets/shadcn/utils"
    }

i tried to put these but it doesnt work

 "aliases": {
    "components": "./src/assets/shadcn/components",
    "utils": "./src/assets/shadcn/lib/utils",
    "ui": "./src/assets/shadcn/components/ui",
    "lib": "./src/assets/shadcn/lib",
    "hooks": "./src/assets/shadcn/hooks"
  }

vite.config.js

resolve: {
        alias: {
            src: path.resolve(__dirname, 'src'),
        },
    },

jsconfig.json

{
    "compilerOptions": {
        "jsx": "react-jsx",
        "target": "ES6",
        "module": "commonjs",
        "baseUrl": "./",
        "paths": {
            "src/*": ["src/*"]
        },
        "allowJs": true,
    "checkJs": false,

    },
    "include": ["src/**/*"],
    "exclude": ["node_modules", "dist"]
}

to

{

    "files": [],
    "references": [
        {
            "path": "./jsconfig.app.json"
        },
        {
            "path": "./jsconfig.node.json"
        }
    ],

    "compilerOptions": {
        "jsx": "react-jsx",
        "target": "ES6",
        "module": "commonjs",
        "baseUrl": ".",
        "paths": {
            "./src/*": ["./src/*"]
        },
        "allowJs": true,
        "checkJs": false

    },
    "include": ["src/**/*"],
    "exclude": ["node_modules", "dist"]
}

in new project

jsconfig.json

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

vite.config.js

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

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],

  resolve: {
    alias: {
      src: path.resolve(__dirname, 'src'),

    },
  },
})

https://github.com/ravenkim/boilerplate_fe