production build issue with `date-fns`

Environment

• Operating System: Darwin
• Node Version: v16.14.0
• Nuxt Version: 3.0.0-rc.6-27668034.5232c1b
• Package Manager: npm@8.3.1
• Builder: vite
• User Config: buildModules, modules, intlify, css, colorMode, build, publicRuntimeConfig, meta
• Runtime Modules: @nuxtjs/color-mode@3.1.4
• Build Modules: @intlify/nuxt3@0.2.3, @pinia/nuxt@0.3.1

Reproduction

https://www.evgyuru.hu/ https://answers.netlify.com/t/this-function-has-crashed-but-i-have-no-netlify-functions/72053/9?u=gyurmatag This repo is not working when deployed to Netlify https://bitbucket.org/gyurmaland/nuxt-app/src/

Describe the bug

I have a Nuxt site deployed to Netlify but for over 2 weeks the site can’t be reached because it says the following:

Here is my site live, so you can see it in action: https://www.evgyuru.hu/ Also somebody from Netlify said that is a bug in Nuxt: https://answers.netlify.com/t/this-function-has-crashed-but-i-have-no-netlify-functions/72053/9?u=gyurmatag I provided the complete logs for this error.

Additional context

No response

Logs

Aug 10, 09:11:29 PM: 93e58501 ERROR  [h3] [unhandled] H3Error: Directory import '/var/task/node_modules/date-fns/fp' is not supported resolving ES modules imported from /var/task/chunks/app/server.mjs
Did you mean to import date-fns/fp/index.js?
    at createError (file:///var/task/node_modules/h3/dist/index.mjs:238:15)
    at nodeHandler (file:///var/task/node_modules/h3/dist/index.mjs:428:21)
    at async ufetch (file:///var/task/node_modules/unenv/runtime/fetch/index.mjs:9:17)
    at async $fetchRaw2 (file:///var/task/node_modules/ohmyfetch/dist/chunks/fetch.mjs:131:20)
    at async Object.errorhandler [as onError] (file:///var/task/chunks/nitro/aws-lambda.mjs:319:16)
    at async nodeHandler (file:///var/task/node_modules/h3/dist/index.mjs:436:9)
    at async ufetch (file:///var/task/node_modules/unenv/runtime/fetch/index.mjs:9:17)
    at async $fetchRaw2 (file:///var/task/node_modules/ohmyfetch/dist/chunks/fetch.mjs:131:20)
    at async Object.errorhandler [as onError] (file:///var/task/chunks/nitro/aws-lambda.mjs:319:16)
    at async nodeHandler (file:///var/task/node_modules/h3/dist/index.mjs:436:9) {
  statusCode: 500,
  fatal: false,
  unhandled: true,
  statusMessage: 'Internal Server Error'
}

[Mokkapps]

I have the same problem with rc7 and rc8 (also edge). I saw this error in the Netlify logs of my function:

Aug 12, 04:11:04 PM: 703edbc4 ERROR  [nuxt] [request error] [unhandled] [500] Named export 'w3cwebsocket' not found. The requested module 'websocket' is a CommonJS module, which may not support all module.exports as named exports.
Aug 12, 04:11:04 PM: 703edbc4 ERROR  CommonJS modules can always be imported via the default export, for example using:
Aug 12, 04:11:04 PM: 703edbc4 ERROR  import pkg from 'websocket';
Aug 12, 04:11:04 PM: 703edbc4 ERROR  const { w3cwebsocket } = pkg;
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at ModuleJob._instantiate (node:internal/modules/esm/module_job:128:21)  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async ModuleJob.run (node:internal/modules/esm/module_job:194:5)  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async Promise.all (index 0)  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async ESMLoader.import (node:internal/modules/esm/loader:385:24)  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async ./chunks/handlers/renderer.mjs:11089:24  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async ./chunks/handlers/renderer.mjs:11143:64  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async ./chunks/handlers/renderer.mjs:14:22  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async ./node_modules/h3/dist/index.mjs:492:19  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async nodeHandler (./node_modules/h3/dist/index.mjs:438:7)  
Aug 12, 04:11:04 PM: 703edbc4 ERROR    at async handler2 (./chunks/nitro/aws-lambda.mjs:4182:13)

[mattmaribojoc]

@Mokkapps I fixed it by adding conditional logic transpile based on env

build: {
    transpile: [process.env.NODE_ENV === 'production' ? 'websocket' : ''],
}