[react] 0.470.0+ crashing deployments

[rub1e]

Package

• lucide
• lucide-angular
• lucide-flutter
• lucide-preact
• lucide-react
• lucide-react-native
• lucide-solid
• lucide-svelte
• lucide-vue
• lucide-vue-next
• Figma plugin
• source/main
• other/not relevant

Version

0.470.0+

Can you reproduce this in the latest version?

• Yes
• No

Browser

• Chrome/Chromium
• Firefox
• Safari
• Edge
• iOS Safari
• Opera
• Other/not relevant

Operating system

• Windows
• Linux
• macOS
• ChromeOS
• iOS
• Android
• Other/not relevant

Description

NOTE: if this is affecting anyone currently, downgrading to 0.469.0 solves it for me

From 0.470.0 using lucide-react icons breaks my react-router v7 deployments.

No problems building locally and serving with react-router serve, and no problem running react-router build for the deployment - no errors or warnings.

But visiting the page seems to crash the Netlify lambda itself (also tested on Vercel). Here is the error log from Netlify:

Jan 17, 01:20:06 PM: ERROR Uncaught Exception {"errorType":"Error","errorMessage":"EMFILE: too many open files, open '/var/task/node_modules/lucide-react/dist/esm/icons/message-circle.js'","code":"EMFILE","errno":-24,"syscall":"open","path":"/var/task/node_modules/lucide-react/dist/esm/icons/message-circle.js","stack":["Error: EMFILE: too many open files, open '/var/task/node_modules/lucide-react/dist/esm/icons/message-circle.js'"]}

Also note that this isn't a react v19 issue, it's happening on 18.3 as well

Steps to reproduce

Here's a minimal repro: https://github.com/rub1e/lucide-react-repro

It's just the Netlify React Router starter with one page with a single lucide icon

Here it is crashing on netlify: https://venerable-sunshine-738964.netlify.app/

Checklist

• I have searched if someone has submitted a similar issue before and there weren't any. (Please make sure to also search closed issues, as this issue might already have been resolved.)

[olivier-thatch]

We're observing the same issue with Next.js 14.2.23 + React 18.3.1.

[inavate-ing]

Just had the same with remix

"@remix-run/node": "^2.15.2",
"@remix-run/react": "^2.15.2",
"@remix-run/serve": "^2.15.2",
"react": "^18.2.0",

https://crowdfunding-tracker.vercel.app/
https://github.com/inavate-ing/crowdfunding-tracker

fixed it for now by downgrading

[fityannugroho]

Same here with astro: ^5.1.7 and react: ^19

fityannugroho/fityannugroho#249

[arnsteinsm]

Same here, built fine locally, but deployment on Vercel failed. Downgraded to 0.469.0 and it works again.

"react": "^18.3.1"

[vasco3]

Same issue in Tanstack Start

[ericfennis]

Can you post the the deployment error logs?

@rub1e If I run your repo locally it's working, even if I build it.

[rub1e]

Yeah it's really strange, I can build and serve it locally just fine. It's only happening when the site is deployed.

Here's everything I get from Netlify logs:

Jan 24, 01:55:51 PM: ERROR  Uncaught Exception 	{"errorType":"Error","errorMessage":"EMFILE: too many open files, open '/var/task/node_modules/lucide-react/dist/esm/icons/message-circle.js'","code":"EMFILE","errno":-24,"syscall":"open","path":"/var/task/node_modules/lucide-react/dist/esm/icons/message-circle.js","stack":["Error: EMFILE: too many open files, open '/var/task/node_modules/lucide-react/dist/esm/icons/message-circle.js'"]}
Jan 24, 01:55:51 PM: ERROR  Uncaught Exception 	{"errorType":"Error","errorMessage":"connect EMFILE 127.0.0.1:9001 - Local (undefined:undefined)","code":"EMFILE","errno":-24,"syscall":"connect","address":"127.0.0.1","port":9001,"stack":["Error: connect EMFILE 127.0.0.1:9001 - Local (undefined:undefined)","    at internalConnect (node:net:1100:16)","    at defaultTriggerAsyncIdScope (node:internal/async_hooks:462:18)","    at node:net:1306:9","    at process.processTicksAndRejections (node:internal/process/task_queues:77:11)"]}
Jan 24, 01:55:51 PM: ERROR  Uncaught Exception 	{"errorType":"Error","errorMessage":"connect EMFILE 127.0.0.1:9001 - Local (undefined:undefined)","code":"EMFILE","errno":-24,"syscall":"connect","address":"127.0.0.1","port":9001,"stack":["Error: connect EMFILE 127.0.0.1:9001 - Local (undefined:undefined)","    at internalConnect (node:net:1100:16)","    at defaultTriggerAsyncIdScope (node:internal/async_hooks:462:18)","    at node:net:1306:9","    at process.processTicksAndRejections (node:internal/process/task_queues:77:11)"]}
Jan 24, 01:55:51 PM: ERROR  Uncaught Exception 	{"errorType":"Error","errorMessage":"connect EMFILE 127.0.0.1:9001 - Local (undefined:undefined)","code":"EMFILE","errno":-24,"syscall":"connect","address":"127.0.0.1","port":9001,"stack":["Error: connect EMFILE 127.0.0.1:9001 - Local (undefined:undefined)","    at internalConnect (node:net:1100:16)","    at defaultTriggerAsyncIdScope (node:internal/async_hooks:462:18)","    at node:net:1306:9","    at process.processTicksAndRejections (node:internal/process/task_queues:77:11)"]}Jan 24, 01:55:51 PM: INIT_REPORT Init Duration: 1139.38 ms	Phase: init	Status: error	Error Type: Runtime.Unknown

Note the first line and reference to message-circle

Also note that these aren't deploy logs, they're Netlify Functions runtime logs

[ThomasStock]

Note I also had this issue running Astro on Vercel.

withastro/astro#13068

[arnsteinsm]

I've had the same result with 0.473.0 and 0.474.0. 0.469.0 deploys ok. This is the closest error: studio:extract-types: require is not defined studio:extract-types: at file://~/path0/node_modules/.pnpm/[email protected][email protected]/node_modules/lucide-react/dist/cjs/lucide-react.js:10:13

[ericfennis]

Can someone check if this is also an issue on 0.471.0 ?
This issue may involve transforming the package into an ESModule Package. 🤔

[rub1e]

@ericfennis just tried 0.471.0 on Netlify, same deal I'm afraid

[ericfennis]

Okay, quite a rabbit hole. Thanks @rub1e for your repro repo, I've set up a Netlify account to research this.

I've no deep understanding of how the Node environment or worker's runtime loads module scripts.
But I assume this is an issue in the ESModule Node/worker environment mode where each module is read as a separate file in runtime instead of memory. With 1500+ icons in the package index file, this adds up quickly and is for some systems too many files at once. Causing the EMFILE errors.

Since 0.470.0 we've switched to exports property in packages JSON. This I think enables the new ESModules file system environment runtime.

I've tried multiple flavors to figure out what the issue is and what works.

• ❌ without exports and with "type"="module"
• ❌ with exports and with "type"="module"
• ✅ without exports and without "type"="module"

Would be nice if someone could explain more in depth or where I can find some information about this.
But I think there is no easy fix than reverting the "exports" property and keep as it was in version 0.469.0.

[jguddas]

If it's a breaking change we should roll it back and release it with v1, no?

[rob101]

I've had the same result with 0.473.0 and 0.474.0. 0.469.0 deploys ok. This is the closest error: studio:extract-types: require is not defined studio:extract-types: at file://~/path0/node_modules/.pnpm/[email protected][email protected]/node_modules/lucide-react/dist/cjs/lucide-react.js:10:13

Looks like its searching for CJS when this should be ECM?

[ericfennis]

@rub1e, @rob101 This is probably another issue. This is not a EMFILE error. You tried to clear cache?

[ericfennis]

@jguddas We are a bit checkmate on this. The Dynamic icon needs to have the exports property in package.json. to define all the different JS Module types. Moving back breaks this.

I've maybe another idea, creating a separate package for the iconNodes and deprecating the dynamicImports This means we could move the DynamicIcon to the main (index.js) entry file.

Other solution could maybe using a Vite plugin to transform imports like the idea in #1944 .

[fredteumer]

I can corroborate that version 0.474.0 is breaking Vercel deployment with the following error:

[Error: EMFILE: too many open files, open '/var/task/node_modules/.pnpm/[email protected][email protected]/node_modules/lucide-react/dist/esm/icons/database.js'] {
  errno: -24,
  code: 'EMFILE',
  syscall: 'open',
  path: '/var/task/node_modules/.pnpm/[email protected][email protected]/node_modules/lucide-react/dist/esm/icons/database.js'
}
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.
[Error: EMFILE: too many open files, open '/var/task/node_modules/.pnpm/[email protected][email protected]/node_modules/lucide-react/dist/esm/icons/crosshair.js'] {
  errno: -24,
  code: 'EMFILE',
  syscall: 'open',
  path: '/var/task/node_modules/.pnpm/[email protected][email protected]/node_modules/lucide-react/dist/esm/icons/crosshair.js'
}
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.

[curran]

Confirming the same error happens on AWS Lambda on version "lucide-react": "^0.474.0",.

ERROR	Error: EMFILE: too many open files, open '/var/task/node_modules/lucide-react/dist/esm/icons/map-pin-plus-inside.js'
    at async open (node:internal/fs/promises:639:25)
    at async readFile (node:internal/fs/promises:1242:14)
    at async getSource (node:internal/modules/esm/load:46:14)
    at async defaultLoad (node:internal/modules/esm/load:137:34)
    at async ModuleLoader.load (node:internal/modules/esm/loader:555:7)
    at async ModuleLoader.moduleProvider (node:internal/modules/esm/loader:434:45)