Build Error in SvelteKit with Cloudflare Pages Following Cloudflare SvelteKit Framework Guide

[onursoyer]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/cloudflare

SDK Version

8.34.0

Framework Version

SvelteKit 2.7.0

Link to Sentry event

No response

Reproduction Example/SDK Setup

import { sequence } from "@sveltejs/kit/hooks";
import { handleErrorWithSentry, sentryHandle } from "@sentry/sveltekit";
import * as Sentry from "@sentry/cloudflare";

const handleInitSentry = ({ event, resolve }) => {
  return event.platform
    ? Sentry.wrapRequestHandler(
        {
          options: {
            dsn: 'YOUR_SENTRY_DSN',
            tracesSampleRate: 1.0,
          },
          request: event.request,
          context: event.platform.ctx,
        },
        () => resolve(event)
      )
    : resolve(event);
};

export const handle = sequence(handleInitSentry, sentryHandle());

Steps to Reproduce

1. npm create svelte@latest my-app
2. npm i -D @sveltejs/adapter-cloudflare
3. Follow instructions on Cloudflare Sveltekit Framework Guide

Expected Result

According to documentation I should be able to build the project without error.

Actual Result

Using @sveltejs/adapter-cloudflare
✘ [ERROR] Could not resolve "$app/stores"

node_modules/@sentry/sveltekit/build/esm/client/browserTracingIntegration.js:1:33:
  1 │ import { page, navigating } from '$app/stores';
    ╵                                  ~~~~~~~~~~~~~

You can mark the path "$app/stores" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle.

error during build:

Error: Bundling with esbuild failed with 1 error
    at adapt (file:///home/onur/Documents/dev/sentry/test/node_modules/@sveltejs/adapter-cloudflare/index.js:140:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async adapt (file:///home/onur/Documents/dev/sentry/test/node_modules/@sveltejs/kit/src/core/adapt/index.js:38:2)
    at async finalise (file:///home/onur/Documents/dev/sentry/test/node_modules/@sveltejs/kit/src/exports/vite/index.js:891:7)
    at async Object.handler (file:///home/onur/Documents/dev/sentry/test/node_modules/@sveltejs/kit/src/exports/vite/index.js:921:5)
    at async PluginDriver.hookParallel (file:///home/onur/Documents/dev/sentry/test/node_modules/rollup/dist/es/shared/node-entry.js:20652:17)
    at async Object.close (file:///home/onur/Documents/dev/sentry/test/node_modules/rollup/dist/es/shared/node-entry.js:21627:13)
    at async build (file:///home/onur/Documents/dev/sentry/test/node_modules/vite/dist/node/chunks/dep-Cyk9bIUq.js:65455:17)
    at async CAC.<anonymous> (file:///home/onur/Documents/dev/sentry/test/node_modules/vite/dist/node/cli.js:828:5)

[Lms24]

Hi @onursoyer thanks for writing in! I can repro this as well with a freshly created SvelteKit app + Cloudflare. The root cause is us importing these stores in our browserTracingIntegration to correctly start spans for client-side navigations and to update the name of the initial pageload span. I'll check what you can do to work around this for the moment but I don't have a clear solution for this. I wonder why the stores are suddenly not available when using the CF adapter.

[Lms24]

Hey, so I did some digging and there seems to be a problem with our package's exports in combination with the SvelteKit cloudflare adapter. I chatted a bit with the Svelte team and opened an issue in the SvelteKit repo. I'll let you know once we hear back from the team.

[saturnonearth]

Any updates on this?

[Lms24]

Hey, no updates unfortunately. I'm still waiting on an update from the Svelte team in sveltejs/kit#12813