Parcel fails to bundle require('node:stream/web') used in node-fetch: gets transformed to import "8a78abd0b0f7c0d4:stream/web";

[danieltroger]

🐛 bug report

I'm trying to bundle a node project into a single file. However, since including node-fetch it no longer works because they do this: https://github.com/node-fetch/fetch-blob/blob/c5c2b5215446334bf496733d4cdb48a981b4c440/streams.cjs#L10

🎛 Configuration (.babelrc, package.json, cli command)

Package.json:

{
  "scripts": {
    "build": "parcel build --detailed-report 400 src/index.ts"
  },
  "devDependencies": {
    "@parcel/core": "nightly",
    "@parcel/fs": "nightly",
    "@types/node": "latest",
    "parcel": "nightly"
  },
  "dependencies": {
    "node-fetch": "latest"
  },
  "targets": {
    "node": {
      "engines": {
        "node": "17.0.1"
      },
      "outputFormat": "commonjs",
      "includeNodeModules": true
    }
  },
  "packageManager": "yarn@3.1.1"
}

🤔 Expected Behavior

An epic build happens and then when you run the file in dist it logs a Response

😯 Current Behavior

daniel@Daniels-MacBook-Pro parcel-weird-imports % yarn build
🚨 Build failed.

@parcel/optimizer-terser: "Import" statement may only appear at the top level

    291 | const $6feab2a8ca4a78b1$var$POOL_SIZE = 65536;
  > 292 | import "6feab2a8ca4a78b1:process";
  >     | ^ "Import" statement may only appear at the top level
    293 | import "6feab2a8ca4a78b1:stream/web";
    294 | 

  💡 It's likely that Terser doesn't support this syntax yet.

The issue is that they do this:

  try {
    const process = require('node:process')
    const { emitWarning } = process
    try {
      process.emitWarning = () => {}
      Object.assign(globalThis, require('node:stream/web'))
      process.emitWarning = emitWarning
    } catch (error) {
      process.emitWarning = emitWarning
      throw error
    }
  } catch (error) {
    // fallback to polyfill implementation
    Object.assign(globalThis, require('web-streams-polyfill/dist/ponyfill.es2018.js'))
  }

which becomes this:

const $8a78abd0b0f7c0d4$var$POOL_SIZE = 65536;
import "8a78abd0b0f7c0d4:process";
import "8a78abd0b0f7c0d4:stream/web";

if (!globalThis.ReadableStream) // `node:stream/web` got introduced in v16.5.0 as experimental
// and it's preferred over the polyfilled version. So we also
// suppress the warning that gets emitted by NodeJS for using it.
try {
    const process = $8a78abd0b0f7c0d4$import$e54fe5b0f43758f7;
    const { emitWarning: emitWarning  } = process;
    try {
        process.emitWarning = ()=>{
        };
        Object.assign(globalThis, $8a78abd0b0f7c0d4$import$a9b7c53552559609);
        process.emitWarning = emitWarning;
    } catch (error) {
        process.emitWarning = emitWarning;
        throw error;
    }
} catch (error) {
    // fallback to polyfill implementation
    Object.assign(globalThis, (parcelRequire("iPmaN")));
}

Which is wrong and then kills terser

💁 Possible Solution

Idk what this magic new require syntax is but somehow fix that it works 👀

🔦 Context

I just wanted to fetch an url 😭
Also when bundling with --no-optimize it does some code splitting, is it possible to disable that? It'd be nice to have a single output file and I think that's even the point of "includeNodeModules": true?

💻 Code Sample

import fetch from "node-fetch";

fetch("https://google.com/").then((r) => console.log(r));

Please see this .zip file:
parcel-weird-imports.zip
Run yarn install then yarn build

🌍 Your Environment

Software	Version(s)
Parcel	2.0.0-nightly.932+cdc1d0e4
Node	v17.0.1
npm/Yarn	3.1.1
Operating System	macOS 10.15.7 (19H1519)

[jonathanfishbein1]

I'm having this issue too with the node: prefix. Webpack also crashed because of this

[mischnic]

Apparently both of these cases are broken:

try {
	// const process = require("node:process");
	const process = require("process");
} catch (error) {}

The first line results in

import "2df1dca29011f67b:process";
try {
    const process = $2df1dca29011f67b$import$e54fe5b0f43758f7;
// const process = require("process");
} catch (error) {
}

and the second one in

try {
    // const process = require("node:process");
    const process = $2df1dca29011f67b$import$e54fe5b0f43758f7;
} catch (error) {
}

[danieltroger]

I just got this which also seems related, when using includeNodeModules: true because alias wasn't working without includeNodeModules

daniel@Daniels-MacBook-Pro heating % yarn build
🚨 Build failed.

@parcel/core: Failed to resolve 'bun:ffi' from './.yarn/unplugged/lmdb-npm-2.5.2-76ec56235a/node_modules/lmdb/native.js'

  [project_dir]/.yarn/unplugged/lmdb-npm-2.5.2-76ec56235a/node_modules/lmdb/native.js:12:46
    11 | if (process.isBun) {
  > 12 |   const { linkSymbols, FFIType } = require('bun:ffi');
  >    |                                               ^^^^^^^^^
    13 |   let lmdbLib = linkSymbols({
    14 |     getByBinary: {