Skip to content

[BUG] Setup fails with lightningcss native binary error on macOS Apple Silicon (and potentially other ARM platforms) #694

@sammy200-ui

Description

@sammy200-ui

Describe the bug
When following the setup instructions for local development, new contributors may encounter PostCSS/lightningcss native binary errors that prevent the development server from working.This occurs because the "lightningcss" native binary (required by Tailwind CSS v4) fails to install properly during the initial "npm install" but npm completes without reporting an error since it's marked as an optional dependency.

To Reproduce
Steps to reproduce the behavior:

  1. Clone the repository:
    git clone https://github.com/drawdb-io/drawdb
    cd drawdb
  2. npm install
  3. npm run dev
  4. Open http://localhost:5173/ in browser

Expected behavior
The development server should start successfully and the application should load without errors.

Actual Behavior
The development server starts but the browser shows a blank page. The terminal displays repeated errors (100+ times):
[vite] Pre-transform error: Failed to load PostCSS config (searchPath: /Users/.../drawdb):
[Error] Loading PostCSS Plugin failed: Cannot find module '../lightningcss.darwin-arm64.node'
Require stack:

  • /Users/.../drawdb/node_modules/lightningcss/node/index.js
  • /Users/.../drawdb/node_modules/@tailwindcss/node/dist/index.js
  • /Users/.../drawdb/node_modules/@tailwindcss/postcss/dist/index.js

(@/Users/.../drawdb/postcss.config.js)
Plugin: vite:css
File: /Users/.../drawdb/src/index.css

Desktop (please complete the following information):

  • OS: macOS (Apple Silicon - M1/M2/M3)
  • Browser :chrome

Proposed Solution
Add a Troubleshooting section to the README.md
to help new contributors who encounter this issue. This would significantly improve the onboarding experience, especially since:

Tailwind CSS v4 is relatively new and uses native binaries
The error message doesn't indicate the solution
npm reports successful installation even when the issue occurs
This can affect contributors on various platforms
The fix is simple once you know about it

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions