Issue while using shadcn-ui with React CRA

[SUMANTH-hyphen]

I'm trying to use a shadcn-ui component in my react app using CRA with typescript and tailwind CSS. Below i have added the primary parts of the code.

tailwind.config.js content: [ './pages/**/*.{ts,tsx}', './components/**/*.{ts,tsx}', './app/**/*.{ts,tsx}', './src/**/*.{ts,tsx}', ],

tsconfig.json [{ "baseUrl": ".", "paths": { "@/*": ["./src/*"] } }, "include": [ "src", "**/*.ts", "**/*.tsx" ]

components.json { "$schema": "https://ui.shadcn.com/schema.json", "style": "default", "rsc": false, "tsx": true, "tailwind": { "config": "tailwind.config.js", "css": "src/index.css", "baseColor": "slate", "cssVariables": true, "prefix": "" }, "aliases": { "components": "@/components", "utils": "@/lib/utils" } }

usage import { Button } from '@/components/ui/button'

Here is the folder structure

Error Module not found: Error: Can't resolve '@/components/ui/button'

[7hourspg]

Use Path in tsconfig.json "paths": { "@/*": ["./src/*"] }

[SUMANTH-hyphen]

Use Path in tsconfig.json "paths": { "@/*": ["./src/*"] }

I've used it, please check the code I provided

[princemuel]

You'd need to install and setup tsconfig paths with craco. Which means you'll have to eject your create-react-app setup. Personally, I'd advise you use Vite instead. Then you won't have this problem

[shadcn]

This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.