Cannot build with Vite and latest sentry plugin version

[pippo111]

Environment

"vite": "4.4.10" (same with 5.x) "@sentry/vite-plugin": "2.18.0",

vite.config.ts

import { defineConfig, loadEnv } from 'vite';
import react from "@vitejs/plugin-react";
import { sentryVitePlugin } from '@sentry/vite-plugin'
import { createHtmlPlugin } from 'vite-plugin-html';
import VitePluginReactRemoveAttributes from 'vite-plugin-react-remove-attributes';

// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd());
  const plugins = [react()];

  plugins.push(
    sentryVitePlugin({
      authToken: env.VITE_SENTRY_KEY,
      org: env.VITE_SENTRY_ORG,
      project: env.VITE_SENTRY_PROJECT,
      telemetry: false,
      sourcemaps: {
        assets: './build/assets',
        ignore: ['node_modules']
      }
    })
  );

  return {
    build: {
      outDir: 'build',
      commonjsOptions: {
        include: [/node_modules/, /types/],
      },
      sourcemap: true,
    },
    worker: {
      format: 'es'
    },
    server: {
      host: '127.0.0.1',
      port: 3000
    },
    preview: {
      host: true,
      port: 3000,
      strictPort: true
    },
    plugins: [
      ...plugins,
      {
        name: 'configure-response-headers',
        configureServer: (server) => {
          server.middlewares.use((_req, res, next) => {
            res.setHeader('Access-Control-Allow-Origin', '*');
            res.setHeader('Strict-Transport-Security', 'max-age=31536000');
            res.setHeader('X-Content-Type-Options', 'nosniff');
            res.setHeader('Referrer-Policy', 'same-origin');
            next();
          });
        },
      },
      createHtmlPlugin({
        inject: {
          data: {
            RECAPTCHA_SITE_KEY: env.VITE_RECAPTCHA_SITE_KEY,
          },
        },
      }),
      ...(env.VITE_E2E_ENVIRONMENT === 'true' ? [] : [
        VitePluginReactRemoveAttributes({
          attributes: ['data-testid'],
        }),
      ]),
    ],
    publicDir: 'public',
    optimizeDeps: {
      include: ['stb-common'],
    },
  };
});

Steps to Reproduce

1. Run build with tsc --build tsconfig.build.json && vite build

Expected Result

Build is completed, release id is created and sourcemaps are sent.

Actual Result

client:build: cache miss, executing ed08942129d3851b
client:build: 
client:build: > client@0.1.0 build /home/project/apps/client
client:build: > tsc --build tsconfig.build.json && vite build
client:build: 
client:build: vite v4.4.10 building for production...
client:build: transforming...
client:build: 
client:build:  WARN  src/constants.ts (1:8) Error when using sourcemap for reporting an error: Can't resolve original location of error.
client:build: 
client:build: ✓ 4322 modules transformed.
client:build: ✓ built in 26.62s
client:build: 
client:build:  ERROR  "Subscriptions" is not exported by "../common/types/dist/index.js", imported by "src/constants.ts".
client:build: file: /home/project/apps/client/src/constants.ts:1:8
client:build: 1: import {Subscriptions} from "stb-common";
client:build:            ^
client:build: 2: import {NotificationsType} from "./store/Notifications";
client:build: 3: export const AXIOS_REQUEST_TIMEOUT = 1e4;
client:build: 
client:build: 
client:build:  ERROR  error during build:
client:build: RollupError: "Subscriptions" is not exported by "../common/types/dist/index.js", imported by "src/constants.ts".
client:build:     at error (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:2287:30)
client:build:     at Module.error (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:13745:16)
client:build:     at Module.traceVariable (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:14175:29)
client:build:     at ModuleScope.findVariable (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:12615:39)
client:build:     at MemberExpression.bind (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:9539:49)
client:build:     at Property.bind (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:5892:23)
client:build:     at ObjectExpression.bind (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:5888:28)
client:build:     at VariableDeclarator.bind (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:5892:23)
client:build:     at VariableDeclaration.bind (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:5888:28)
client:build:     at ExportNamedDeclaration.bind (file:///home/project/apps/node_modules/.pnpm/rollup@3.29.4/node_modules/rollup/dist/es/shared/node-entry.js:10673:27)
client:build: 
client:build:  ELIFECYCLE  Command failed with exit code 1.
client:build: ERROR: command finished with error: command (/home/project/apps/client) pnpm run build exited (1)

I'm trying to move from 0.4.0 to the 2.18.0 With previous version build is completed. Now I got this error. Am I missing something with the configuration? Without the plugin the build is complete without any issues...

[lforst]

I don't see how this error can be related to the Sentry bundler plugins. Would you mind sharing a minimal reproduction example we can pull? Thanks!

[pippo111]

What I just discovered is that the build breaks from version 0.6.0. Version 0.5.1 is working. Was there any significant changes between these two?

[lforst]

These are the changes: https://github.com/getsentry/sentry-javascript-bundler-plugins/compare/0.5.1...0.6.0

Looks very much unrelated to this error.

[pippo111]

Hmm, the main reason why I'm trying to update the package is that I cannot read SENTRY_RELEASE. I'm using it to init my sentry and provide it like so:

Sentry.init({
    release: import.meta.env.SENTRY_RELEASE?.id,

but for some reason I cannot get this value, though it was there earlier... Is there a way to transfer realease id created by the plugin to the client code?

[lforst]

We do not consider the value passed from the plugin to the SDK as public API. The plugin automatically passes the release value to the init call, or you can also use an ordinary env var.

All I can say is that import.meta.env.SENTRY_RELEASE?.id is completely wrong. import.meta.env will never contain objects. Where did you get this from?

[pippo111]

That was the old code I encountered inside the project. Anyway I found a way to pass the release id into meta.env, but as you mentioned this is not even necessary?

And sorry for the confusion, but the build is breaking on version 0.5.0 (earlier I mentioned 0.6.0)

[lforst]

When you provide a release value to the plugin, it automatically injects it into your bundle.

I don't think we can debug this further unless we get reproduction.

[pippo111]

@lforst Hey, I managed to create small reproduction repository: https://github.com/pippo111/vite-sentry-repro

As you can observe, the build is failing. But when you remove sentry plugin from here it works. You can see that common/types are CommonJS but that is required for my project. Nevertheless when you change it to ES2020 then the build works even with the sentry plugin. But the main issue is that it works fine as commonjs without sentry plugin but breaks with it.

[pippo111]

I've just noticed, that removing

commonjsOptions: {
  include: [/node_modules/, /types/],
},

breaks the build as well. Which is expected as it informs rollup commonjs plugin to transform cjs to ejs. So is it possible that sentry plugin is overriding this option or not using it at all?

[andreiborza]

Hey @pippo111, thanks for the reproduction. We're taking a look and will get back to you.

[kYem]

I'm also running in to the same issue, enablingsentryVitePlugin when we have optimizeDeps.include: ["@internal/units"] breaks the build.

 RollupError: "default" is not exported by "../../packages/units/lib/index.js", imported by "../../packages/shared/src/utils/units.ts".
at error (app/node_modules/rollup/dist/es/shared/node-entry.js:2287:30)
at Module.error (app/node_modules/rollup/dist/es/shared/node-entry.js:13745:16)
at Module.traceVariable (app/node_modules/rollup/dist/es/shared/node-entry.js:14175:29)
at ModuleScope.findVariable (app/node_modules/rollup/dist/es/shared/node-entry.js:12615:39)
at Identifier.bind (app/node_modules/rollup/dist/es/shared/node-entry.js:8319:40)
at CallExpression.bind (app/node_modules/rollup/dist/es/shared/node-entry.js:5892:23)
at CallExpression.bind (app/node_modules/rollup/dist/es/shared/node-entry.js:9890:15)
at VariableDeclarator.bind (app/node_modules/rollup/dist/es/shared/node-entry.js:5892:23)
at VariableDeclaration.bind (app/node_modules/rollup/dist/es/shared/node-entry.js:5888:28)
at Program.bind (app/node_modules/rollup/dist/es/shared/node-entry.js:5888:28)

[andreiborza]

Hello, sorry we are still looking into this.

@kYem do you have a reproduction for that, some github repo or a stackblitz would help a lot.

[andreiborza]

@pippo111 thanks again for the reproduction, it helped us narrowing down the problem. It looks like when our plugin injects the release into the bundle it trips up @rollup/plugin-commonjs. We have a potential solution in mind, but still need to ensure it doesn't break anything else.

In the meantime, to unblock you, you can set release: { inject: false } in the plugin options:

// vite.config.ts
...
      sentryVitePlugin({
        authToken: 'sntrys_',
        org: 'org',
        project: 'project',
        telemetry: false,
        release: { inject: false }
      }),

And then manually set a release in Sentry.init as written in the docs.