Plugin corrupts the build

[AndrewHaluza]

Environment

Distributor ID: Ubuntu
Description:    Ubuntu 22.04.5 LTS
Release:        22.04
Codename:       jammy

node --version
v22.14.0

What version are you running? Etc.

"react": "^17.0.2",
"@sentry/esbuild-plugin": "^4.5.0"

Steps to Reproduce

npm run dev
OR
npm run build

Expected Result

Working build with uploaded source maps with the rest plugin functionality.

Actual Result

After the build is done no errors, only one warning printed (ref #747). But the build is not working (blank page) with an error in the browser console:
console error log:

10:24:42.402 Uncaught SyntaxError: export declarations may only appear at top level of a module index.js:268882:1

index.js:268882:1 snippet:

// src/index.tsx?sentryProxyModule=true
var index_default = void 0;
export {
  index_default as default
};

Configured plugin:

{
  authToken: process.env.SENTRY_AUTH_TOKEN,
  org: "some",
  project: "thing",
  silent: process.env.APP_BUILD_VERBOSE !== "true",
  sourcemaps: true,
  disable: process.env.REACT_SENTRY_ENABLED !== "true",
  debug: process.env.REACT_SENTRY_DEBUG === "true",
}

esbuild config:

  entryPoints: ["src/index.tsx"],
  bundle: true,
  outdir: "dist",
  format: "esm",
  platform: "browser",
  jsx: "automatic", // Use the React 17+ JSX transform
  external: ["media/fonts/*"],
  entryNames,
  assetNames,
  sourcemap: true,
  treeShaking: true,
  metafile: true,
  define: {
    ...ENVIRONMENT_VARIABLES,
    "process.env.REACT_APP_GIT_COMMIT": JSON.stringify(getGitCommitHash()),
  },
  loader: {
    ".js": "jsx",
    ".jsx": "jsx",
    ".ts": "ts",
    ".tsx": "tsx",
    ".png": "dataurl",
    ".webp": "dataurl",
    ".svg": "dataurl",
    ".woff": "dataurl",
    ".woff2": "dataurl",
    ".ttf": "dataurl",
    ".eot": "dataurl",
  },
  plugins: [
    polyfillNode(),
    svgr(),
    sassPlugin({
    ...
    }),
    sassPlugin({
      ...
    }),
    tailwindPlugin,
    lessLoader({
     ...
    }),
    copy({
    ...
    }),
    // Put the Sentry esbuild plugin after all other plugins
      ...(process.env.REACT_SENTRY_ENABLED === "true"
        ? [sentryEsbuildPlugin(sentryBuildConfig)]
        : []),
  ],

Build logs

▲ [WARNING] Import "default" will always be undefined because there is no matching export in "src/index.tsx" [import-is-undefined]

    src/index.tsx?sentryProxyModule=true:4:44:
      4 │               export default OriginalModule.default;
        ╵                                             ~~~~~~~

[ESBUILD] Build ended
                [-] ✅ errors: 0
                [-] 🟡 warnings: 1
[DEV] Server running:
    http://localhost:3000/

> Found 2 files
> Analyzing 2 sources
> Analyzing completed in 0.035s
> Adding source map references
> Bundling completed in 1.649s
> Bundled 2 files for upload
> Bundle ID: **********************************
> Optimizing completed in 0.031s
> Uploading completed in 0.532s
> Uploaded files to Sentry
> Processing completed in 0.423s
> File upload complete (processing pending on server)
> Organization: some
> Projects: thing
> Release: **********************************
> Dist: None
> Upload type: artifact bundle

Source Map Upload Report
  Scripts
    ~/**********************************-0.js (sourcemap at index.js.map, debug id **********************************)
  Source Maps
    ~/**********************************-0.js.map (debug id **********************************)
[sentry-esbuild-plugin] Info: Successfully uploaded source maps to Sentry

[linear]

BUNDLER-86

[s1gr1d]

Hi and thanks for writing in, can you create a small reproduction example for this?

[MaksymSofer]

we went with manual invoking of sentry_cli