oven-sh / bun

Incredibly fast JavaScript runtime, bundler, test runner, and package manager – all in one
https://bun.sh
Other
73.26k stars 2.69k forks source link

Pixijs built with `Bun.build` fails to run in-browser whereas `esbuild`'s succeeds #9360

Open tsujp opened 6 months ago

tsujp commented 6 months ago

What version of Bun is running?

1.0.30+1424a196f

What platform is your computer?

Darwin 23.3.0 arm64 arm

What steps can reproduce the bug?

Execution steps

Source files are lower down in this section for your copy-pasting.

  1. Create files with (the below) contents.
  2. bun run build_bun.ts and use Bun.serve to observe the reported error.
  3. bun run build_esbuild.mjs and use Bun.serve to see a black WebGL canvas created without error.

Source files

./src/index.ts

import { Application } from 'pixi.js'

const app = new Application()
await app.init({ width: 640, height: 360 })
document.body.appendChild(app.canvas)

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Foobar</title>
    <style>
      body {
        margin: 0;
      }
  </style>
  </head>
  <body>
    <script type="module" src="../out/index.js"></script>
  </body>
</html>

Build files

Bun's version: build_bun.ts

// The resulting bundle fails to run in both Firefox and Chrome.
await Bun.build({
  entrypoints: ['./src/index.ts'],
  outdir: './out',
})

esbuild's version: build_esbuild.mjs

import * as esbuild from 'esbuild'

// Note not even specifically targeting browsers in esbuilds config.
await esbuild.build({
  entryPoints: ['./src/index.ts'],
  bundle: true,
  outfile: './out/index.js',
  format: 'esm'
})

Packages

package.json

{
  "name": "foo",
  "private": true,
  "version": "0.1.0",
  "author": "foo",
  "license": "BSD-3-Clause",
  "type": "module",
  "scripts": {},
  "repository": {
    "type": "git"
  },
  "keywords": [],
  "dependencies": {
    "pixi.js": "^8.0.1"
  },
  "devDependencies": {
    "@types/bun": "^1.0.0",
    "esbuild": "^0.20.1"
  }
}

Resolved package versions

$ bun pm ls
├── @types/bun@1.0.8
├── esbuild@0.20.1
└── pixi.js@8.0.1

What is the expected behavior?

Seeing a black WebGL canvas of the specified resolution with no errors in the browser console.

What do you see instead?

A DOM without a WebGL canvas and the following (equivalent) errors in the console for Firefox and Chrome respectively.

TypeError: class heritage eventemitter3_default is not an object or null
    <anonymous> http://localhost:3000/out/index.js:2610
Uncaught TypeError: Class extends value undefined is not a constructor or null
    at index.js:2610:25

Additional information

Browsers tested:

Minimal Reproduceable Example

See: https://github.com/tsujp/pixijs_bun_bug_mre

tsujp commented 6 months ago

I've added an MRE repo for easier bug squashing: https://github.com/tsujp/pixijs_bun_bug_mre