[bug]: Build errors on new project initialisation

Ihavenowand commented 2 weeks ago

Describe the bug

When creating a new install of NextJS and adding ShadCN UI components, a number of build issues prevent deploying to vercel.

There is zero custom code here. Default install of NextJS and ShadCN.

I don't understand how build errors start immediately after installing from npx.

Affected component/components

calendar.tsx, chart.tsx, command.tsx, input.tsx, textarea.tsx, use-toast.ts

How to reproduce

Install new instance of NextJS -- npx create-next-app@latest
Init ShadCN -- npx shadcn@latest init as per documentation
Add components -- npx shadcn@latest add & use a option to select all components
Commit to github & deploy to vercel project.

Codesandbox/StackBlitz link

No response

Logs

[17:11:55.609] > next build
[17:11:55.609] 
[17:11:57.052]   ▲ Next.js 14.2.14
[17:11:57.053] 
[17:11:57.127]    Creating an optimized production build ...
[17:12:06.593]  ✓ Compiled successfully
[17:12:06.594]    Linting and checking validity of types ...
[17:12:12.200] 
[17:12:12.200] Failed to compile.
[17:12:12.200] 
[17:12:12.200] ./src/components/ui/calendar.tsx
[17:12:12.200] 57:25  Error: 'props' is defined but never used.  @typescript-eslint/no-unused-vars
[17:12:12.200] 58:26  Error: 'props' is defined but never used.  @typescript-eslint/no-unused-vars
[17:12:12.200] 
[17:12:12.200] ./src/components/ui/chart.tsx
[17:12:12.200] 72:7  Error: '_' is defined but never used.  @typescript-eslint/no-unused-vars
[17:12:12.200] 
[17:12:12.200] ./src/components/ui/command.tsx
[17:12:12.200] 26:11  Error: An interface declaring no members is equivalent to its supertype.  @typescript-eslint/no-empty-object-type
[17:12:12.200] 
[17:12:12.200] ./src/components/ui/input.tsx
[17:12:12.201] 5:18  Error: An interface declaring no members is equivalent to its supertype.  @typescript-eslint/no-empty-object-type
[17:12:12.201] 
[17:12:12.201] ./src/components/ui/textarea.tsx
[17:12:12.201] 5:18  Error: An interface declaring no members is equivalent to its supertype.  @typescript-eslint/no-empty-object-type
[17:12:12.201] 
[17:12:12.201] ./src/hooks/use-toast.ts
[17:12:12.201] 21:7  Error: 'actionTypes' is assigned a value but only used as a type.  @typescript-eslint/no-unused-vars
[17:12:12.201] 
[17:12:12.201] info  - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
[17:12:12.243] Error: Command "npm run build" exited with 1

System Info

Github, Vercel

Before submitting

[X] I've made research efforts and searched the documentation
[X] I've searched for existing issues

Sama-004 commented 2 weeks ago

it's because of your es lint configuration. Can you share your .eslintrc

To solve this issue you can just remove the no unused vars and no unused objects from your .eslintrc

ngogiahuandev commented 1 week ago

How to solve this, i have the same issue

prajnaprabhu3 commented 1 week ago

How to solve this, i have the same issue

to ignore these ts errors during build time, you can set ignoreDuringBuilds to true

module.exports = {
  eslint: {
    ignoreDuringBuilds: true,
  },
}

Or you can disable certain rules by making changes in your .eslintrc.json file

{
  "extends": "next",
  "rules": {
    "react/no-unescaped-entities": "off",
    "@next/next/no-page-custom-font": "off"
  }
}

Or can make the necessary correction in those respective files created by shadcn https://github.com/shadcn-ui/ui/pull/5232 https://github.com/shadcn-ui/ui/pull/5264 https://github.com/shadcn-ui/ui/pull/5222 these PR's mostly fixed these issues

shadcn-ui / ui