Fix: Show helpful error when using new App() syntax in Svelte 5

[ZiuChen]

Problem

In Svelte 5, components are no longer classes and should be instantiated using mount() instead of new Component(). However, when users try the old syntax, they get a cryptic error instead of helpful guidance:

// Svelte 5 - this throws a confusing error
const app = new App({ target: document.body });
// TypeError: Cannot read properties of null (reading 'nodes_start')

// Should use this instead
import { mount } from 'svelte';
const app = mount(App, { target: document.body });

The cryptic "nodes_start" error provides no indication that the issue is using the wrong instantiation method, making migration from Svelte 4 to 5 unnecessarily difficult.

Root Cause

Svelte 5 components include a check_target(new.target) call to detect constructor usage and show a helpful error message. However, this check was only included in development builds (dev: true), not in production builds. When the check is missing, the component execution continues with invalid parameters, eventually failing deep in the DOM manipulation code with the cryptic error.

Solution

Modified the compiler to always include the constructor check in both development and production builds. The helpful error message is already implemented and working correctly - it just needed to be enabled in production.

Before (production build):

TypeError: Cannot read properties of null (reading 'nodes_start')

After (all builds):

Svelte error: Attempted to instantiate a component with `new ComponentName`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working.
https://svelte.dev/e/component_api_invalid_new

Changes

• Compiler: Changed condition in transform-client.js from checking dev mode only to always including the constructor check (except when using legacy compatibility mode)
• Tests: Added test case to verify the fix works in both dev and production builds

The change is minimal and surgical - only 2 lines modified in the compiler, with the existing error handling infrastructure doing the rest.

Impact

• ✅ Provides clear migration guidance for Svelte 4 → 5 users
• ✅ Maintains all existing functionality
• ✅ No breaking changes
• ✅ Minimal bundle size impact (check is already tree-shakeable)
• ✅ Works in both development and production environments

Fixes the issue described in the problem statement where users encounter confusing errors when using the old component instantiation syntax.

Related Issue

#13991

[changeset-bot]

⚠️ No Changeset found

Latest commit: d51edf5

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[dummdidumm]

Thank you, but we are not going to add this in production builds - it adds overhead both in terms of bundle size and performance. 99% of the time you will run into this while in dev mode where you see the error so it's not worth expanding this check to prod. Therefore closing.