CRA-PATH-ALIAS.MD

How to use '@' path alias in CRA

1. Install the craco dependency:

   npm i -D @craco/craco

2. create 'craco.config.js' and past the following:

   /* craco.config.js */
   const path = require(`path`);
   
   module.exports = {
     webpack: {
       alias: {
         "@": path.resolve(__dirname, "src/"),
       },
     },
   };

3. Use craco in package.json:

   "scripts": {
   - "start": "npm start",
   - "build": "npm build",
   + "start": "craco start",
   + "build": "craco build",
     "eject": "react-scripts eject"
   },

4. You can now use the @ path alias the same way its used in shadcn/ui:

   import { cn } from "@/lib/utils";