Remix v2 node:stream issue?

[frantjc]

After upgrading to Remix v2.0.1 from v1.19.3 and running my application, it crashes with:

ReferenceError: self is not defined
at node_modules/@jspm/core/nodelibs/browser/chunk-ce0fbc82.js (file:///src/build/index.js?t=1696995086361.9636:869:602)
at file:///src/build/index.js?t=1696995086361.9636:14:56
at node_modules/@jspm/core/nodelibs/browser/chunk-44e51b61.js (file:///src/build/index.js?t=1696995086361.9636:4220:5)
at file:///src/build/index.js?t=1696995086361.9636:14:56
at node_modules/@jspm/core/nodelibs/browser/chunk-6c718bbe.js (file:///src/build/index.js?t=1696995086361.9636:4291:5)
at file:///src/build/index.js?t=1696995086361.9636:14:56
at node-modules-polyfills:stream (file:///src/build/index.js?t=1696995086361.9636:4312:5)
at file:///src/build/index.js?t=1696995086361.9636:14:56
at file:///src/build/index.js?t=1696995086361.9636:5666:1
at ModuleJob.run (node:internal/modules/esm/module_job:192:25)

I have stream enabled in my remix.config.js:

/** @type {import('@remix-run/dev').AppConfig} */
export default {
  serverDependenciesToBundle: [
    "http-proxy",
    "sitemap",
    "xml",
  ],
  serverMinify: true,
  serverModuleFormat: "esm",
  serverNodeBuiltinsPolyfill: {
    modules: {
      stream: true
    },
  },
};

The relevant parts of my package.json:

{
  "private": true,
  "sideEffects": false,
  "type": "module",
  "scripts": {
    "dev": "remix dev --manual -c 'node ./server.js'",
  },
  "dependencies": {
    "@remix-run/css-bundle": "^2.0.1",
    "@remix-run/express": "^2.0.1",
    "@remix-run/node": "^2.0.1",
    "@remix-run/react": "^2.0.1",
    "compression": "^1.7.4",
    "express": "^4.18.2",
    "express-http-proxy": "^1.6.3",
    "http-proxy": "^1.18.1",
    "isbot": "^3.6.13",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "sitemap": "^7.1.1",
    "source-map-support": "^0.5.21",
    "xml": "^1.0.1"
  },
  "devDependencies": {
    "@remix-run/dev": "^2.0.1",
    "@remix-run/eslint-config": "^2.0.1",
    "@types/compression": "^1.7.2",
    "@types/express": "^4.17.17",
    "@types/react": "^18.2.21",
    "@types/react-dom": "^18.2.7",
    "@types/source-map-support": "^0.5.6",
    "@types/xml": "^1.0.9",
    "cross-env": "^7.0.3",
    "dotenv": "^16.0.3",
    "eslint": "^8.49.0",
    "eslint-config-prettier": "^9.0.0",
    "npm-run-all": "^4.1.5",
    "prettier": "^3.0.3",
    "typescript": "^5.2.2"
  },
  "engines": {
    "node": ">=18.0.0"
  }
}

My entry.server.ts uses this from stream:

import { PassThrough } from "stream";

and I have a route that uses this from stream:

import { Readable } from "stream";

[frantjc]

Something about library incompatibility regarging esm as opposed to cjs, just going to stick with cjs.

[Moses-Oyelade]

sticking with .cjs file naming extension gave an error at export default, how can this be fixed?