"Error: EMFILE: too many open files... " when deploying Nuxt 3 app with Phosphor Icons to Netlify

[miracleonyenma]

🐛 The bug

When I deploy my Nuxt 3 app which uses the @phosphor-icons/vue package to Netlify, the deployment is successful but when I visit the site, initially, I get an error:

After some time, when I revisit the site, I get this error:

It works okay in development and I've also tried building the app locally, Nuxt uses the "node-server" option and that works fine.

🛠️ To reproduce

https://stackblitz.com/edit/nuxt-starter-tfqdxc?file=app.vue

🌈 Expected behaviour

The Icons should be displayed in production when deployed to Netlify and not crash the entire app.

ℹ️ Additional context

No response

[dnlsndr]

Sorry for getting back to you so late, aparrently I wasn't automatically set as an assignee.
This error is interesting, I wouldn't know why netlify runs out of file descriptors. After all this library is really just a accumulation of pre-compiled components.
Does your repro represent your project exactly or is it just a placeholder-repro for us to test against?
Seems that you haven't really installed any packages in your repro, could you please provide the nuxt config as well as your package.json of your actual project where this issue occurs so I can better check what's going on?

[miracleonyenma]

Hey @dnlsndr, thanks so much for responding to this issue.
Yes, it's a placeholder reproduction you can test against but the issue only appears during deployment.
Here's a repository with the code from the StackBlitz reproduction.
I deployed it on Netlify and you can visit the site to see the error.

package.json

{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "HOST=0.0.0.0 nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "nuxt": "^3.3.3"
  },
  "dependencies": {
    "@phosphor-icons/vue": "^2.0.1"
  }
}

nuxt.config.ts

// https://v3.nuxtjs.org/api/configuration/nuxt.config
export default defineNuxtConfig({

})

I believe the error can be addressed using this simple Nuxt project since the error occurs here. I hope that's okay.

Thanks @dnlsndr

[dnlsndr]

I've implemented a compact build that's only a single file. This should help with your building issues. Check the release notes: https://github.com/phosphor-icons/vue/releases/tag/v2.1.4

[EmilyYond]

@dnlsndr I have changed all my imports to be import { PhBed, PhMapPin } from "@phosphor-icons/vue/compact" and it worked for one build, but now it is erroring again. I deleted packages and reinstalled, but same issue. I'm running "@phosphor-icons/vue": "^2.2.1", and deploying on vercel, which is just returning a 500 error:

[nuxt] [request error] [unhandled] [500] EMFILE: too many open files, open '/var/task/chunks/build/styles.mjs'
  at async open (node:internal/fs/promises:636:25)  
  at async readFile (node:internal/fs/promises:1246: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:396:7)  
  at async ModuleLoader.moduleProvider (node:internal/modules/esm/loader:278:45)  
  at async link (node:internal/modules/esm/module_job:78:21)