firecrawl / firecrawl/open-lovable
Tailwind CSS v4 Compatibility Issue on Windows while setup
- Dominant language
- TypeScript
- Stars
- 28.4k
- Forks
- 5.4k
- PR merge metrics
- No merged PRs in 30d
Description
When running npm run dev on Windows, the application fails to start due to a missing native module for lightningcss, which is a dependency of Tailwind CSS v4.
## Error message:
Build Error
Error evaluating Node.js code
./app/globals.css
Error evaluating Node.js code
Error: Cannot find module '../lightningcss.win32-x64-msvc.node'
Require stack:
- C:\Users\Rakshit\OneDrive\Desktop\open-lovable\node_modules\lightningcss\node\index.js
- C:\Users\Rakshit\OneDrive\Desktop\open-lovable\node_modules\@tailwindcss\node\dist\index.js
- C:\Users\Rakshit\OneDrive\Desktop\open-lovable\node_modules\@tailwindcss\postcss\dist\index.js
- C:\Users\Rakshit\OneDrive\Desktop\open-lovable\.next\build\chunks\[turbopack]_runtime.js
- C:\Users\Rakshit\OneDrive\Desktop\open-lovable\.next\postcss.js
## Environment
- OS: Windows
- Node.js: Latest version
- Next.js: 15.4.3 with Turbopack
- Tailwind CSS: v4.1.11 (problematic version)
## Solution
### Option 1: Downgrade to Tailwind CSS v3 (Recommended)
-> Update the readme.md setup file and tell for downloading Tailwind CSS v3.
- npm uninstall tailwindcss @tailwindcss/postcss
- npm install tailwindcss@3.4.1 postcss autoprefixer --save-dev
- Update PostCSS config in postcss.config.mjs :
const config = {
plugins: {
tailwindcss: {}, // Changed from '@tailwindcss/postcss'
autoprefixer: {},
},
};
export default config;
- Update CSS directives in app/globals.css :
@tailwind base;
@tailwind components;
@tailwind utilities;
/* Replace the previous @import "tailwindcss"; */
### Option 2: Fix Tailwind CSS v4 Installation (Not Tested)
If you need to use Tailwind CSS v4 specifically, you might try:
1. Clearing npm cache: npm cache clean --force
2. Reinstalling dependencies: npm install
3. Manually installing lightningcss: npm install lightningcss
## Additional Notes
- The project has multiple lockfiles (package-lock.json and pnpm-lock.yaml), which might cause dependency resolution issues. Consider removing one of them.
- Tailwind CSS v4 is still in early stages and might have compatibility issues on some platforms.
- Using Tailwind CSS v3.4.1 provides a stable experience across all platforms.
### I can work on this if consider option 1 then i'll modifiy setup in README.md and if u consider option 2 i can also work on this.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.