Fix Tailwind configuration and use Turbopack

[leerob]

Update Next.js Configuration and Dependencies

Overview

This pull request introduces several updates to the Next.js application configuration, dependency versions, and TypeScript settings. These changes aim to enhance the application's structure, compatibility with newer libraries, and overall development experience.

Changes

• Refactoring:
  • Removed the PWA configuration from next.config.mjs, simplifying the configuration.
  • Updated the Tailwind CSS configuration in tailwind.config.ts to include specific directories for component scanning, improving clarity and organization.
• Other Changes:
  • Updated the TypeScript reference URL in next-env.d.ts to point to the latest documentation.
  • Upgraded the Next.js version to 15.0.0-canary.112 and React version to 19.0.0-rc-68dbd84b-20240812 in package.json.
  • Modified the dev script in package.json to utilize the --turbo flag for improved performance during development.
• New Features:
  • While not explicitly mentioned, the upgrade to React 19 may introduce new features and performance improvements.

✨ Generated with love by Kaizen ❤️

Original Description

[kaizen-bot[bot]]

Code Review

❗ Attention Required: This PR has potential issues. 🚨

Dependency Updates

Updated Next.js to canary version and React to release candidate

Potential Solution: Consider using stable versions of Next.js and React for production environments.

apps/web/package.json | 30 - 35

reason_for_request: Using pre-release versions in production can lead to instability and unexpected behavior.

level: [critical] , severity: [10]

✨ Generated with love by Kaizen ❤️

Useful Commands

• Feedback: Reply with !feedback [your message]

• Ask PR: Reply with !ask-pr [your question]

• Review: Reply with !review

[Dhravya]

Just tried to run it locally, not sure why the imports don't resolve anymore 😅

 ✓ Compiled / in 31.3s
 ⨯ ./apps/web/app/(landing)/CardPatterns/AnimatedBeamWithOutput.tsx.tsx
Module not found: Can't resolve './AnimatedBeamWithOutput.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./apps/web/app/(landing)/Features.tsx.tsx
Module not found: Can't resolve './Features.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./apps/web/app/(landing)/Hero.tsx.tsx
Module not found: Can't resolve './Hero.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./apps/web/app/(landing)/Navbar.tsx.tsx
Module not found: Can't resolve './Navbar.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./apps/web/app/(landing)/RotatingIcons.tsx.tsx
Module not found: Can't resolve './RotatingIcons.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./apps/web/app/(landing)/Showcase.tsx.tsx
Module not found: Can't resolve './Showcase.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./apps/web/app/global-error.tsx.tsx
Module not found: Can't resolve './global-error.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./apps/web/app/providers.tsx.tsx
Module not found: Can't resolve './providers.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./packages/ui/shadcn/toaster.tsx.tsx
Module not found: Can't resolve './toaster.tsx.tsx'

https://nextjs.org/docs/messages/module-not-found

./packages/ui/lib/utils.ts:2:1
Module not found: Can't resolve 'tailwind-merge'
  1 | import { type ClassValue, clsx } from "clsx";
> 2 | import { twMerge } from "tailwind-merge";
    | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  3 |
  4 | export function cn(...inputs: ClassValue[]) {
  5 |   return twMerge(clsx(inputs));

https://nextjs.org/docs/messages/module-not-found

 ○ Compiling /_error ...
 ✓ Compiled /_error in 6.1s
 GET / 500 in 38540ms

[RamGoel]

@Dhravya what's this .tsx.tsx in imports ? (Just curious)

[Dhravya]

@RamGoel I'm not sure either, maybe it's resolving the dependencies differently, out right now but will look into it

[CodeTorso]

would love to see the performace benefits but

[BlankParticle]

@RamGoel I'm not sure either, maybe it's resolving the dependencies differently, out right now but will look into it

I ran into this issue while trying to implement million lint into our codebase, it doesn't work with turbopack If you want million lint, turbopack is not an option for you

[Dhravya]

update: @aidenybai is helping fix this error