angular/angular-cli · error · Error

The "application" and "browser-esbuild" builders do not supp

Error message

The "application" and "browser-esbuild" builders do not support Webpack transforms.

What it means

The dev-server supports two backends: webpack-based builders (browser) and esbuild-based ones (application, browser-esbuild). Webpack-specific transforms (logging callback, webpackConfiguration overrides) only apply to the webpack backend; when an esbuild-based builder is detected together with such transforms, the dev-server throws instead of silently ignoring them.

Source

Thrown at packages/angular_devkit/build_angular/src/builders/dev-server/builder.ts:70

  // Determine project name from builder context target
  const projectName = context.target?.project;
  if (!projectName) {
    context.logger.error(`The "dev-server" builder requires a target to be specified.`);

    return EMPTY;
  }

  context.logger.warn(
    'The "@angular-devkit/build-angular:dev-server" builder is deprecated as part of Angular\'s Webpack support deprecation. ' +
      'Use "@angular/build:dev-server" instead. For more information, see https://angular.dev/tools/cli/build-system-migration.',
  );

  return defer(() => initialize(options, projectName, context, extensions?.builderSelector)).pipe(
    switchMap(({ builderName, normalizedOptions }) => {
      // Use vite-based development server for esbuild-based builds
      if (isEsbuildBased(builderName)) {
        if (transforms?.logging || transforms?.webpackConfiguration) {
          throw new Error(
            `The "application" and "browser-esbuild" builders do not support Webpack transforms.`,
          );
        }

        if (options.publicHost) {
          context.logger.warn(
            `The "publicHost" option will not be used because it is not supported by the "${builderName}" builder.`,
          );
        }

        if (options.disableHostCheck) {
          context.logger.warn(
            `The "disableHostCheck" option will not be used because it is not supported by the "${builderName}" builder.`,
          );
        }

        // New build system defaults hmr option to the value of liveReload
        normalizedOptions.hmr ??= normalizedOptions.liveReload;

View on GitHub (pinned to bb72145f9a)

Solutions

  1. Remove transforms.webpackConfiguration and transforms.logging from the dev-server invocation.
  2. If you need equivalent customization, configure the application builder via its own options (e.g. vite config / build options) instead of webpack transforms.
  3. Switch the project's build target back to the webpack browser builder only if webpack transforms are unavoidable (not recommended; browser builder is deprecated).
  4. Update the third-party tool that injects transforms to an esbuild/vite-compatible version.

Example fix

// before
execute({ /* options */ }, { builderSelector }, { webpackConfiguration: (c) => c })
// after
execute({ /* options */ }, { builderSelector }) // no webpack transforms with esbuild builders
Defensive patterns

Strategy: validation

Validate before calling

const ESBUILD_BASED = new Set(['@angular/build:application', '@angular-devkit/build-angular:application', '@angular-devkit/build-angular:browser-esbuild']);
if (transforms?.webpackConfiguration || transforms?.logging) {
  if (ESBUILD_BASED.has(builderName)) {
    throw new Error(`Remove webpack transforms for esbuild builder ${builderName}`);
  }
}

Type guard

const isEsbuildBased = (builderName: string): boolean =>
  /application|browser-esbuild|vite/.test(builderName);

Try / catch

try {
  await startDevServer(options, transforms);
} catch (e) {
  if (String(e.message).includes('do not support Webpack transforms')) {
    // retry without transforms or switch to webpack-based builder
  }
  throw e;
}

Prevention

When it happens

Trigger: Passing transforms: { webpackConfiguration } or transforms: { logging } to execute Dev Server Builder's execute() while the project's build target uses the application or browser-esbuild builder; programmatic scheduling of the dev-server with transforms against an esbuild-based project.

Common situations: Migrating a project from browser/webpack builder to application/esbuild builder but keeping old tooling that injected webpack transforms; third-party libraries (e.g. analytics or bundle-analyzer integrations) that hook webpack configuration; custom scripts written for the webpack dev-server API.

Related errors


AI-assisted analysis of angular/angular-cli@bb72145f9a (2026-08-30). Data as JSON: /api/errors/3e50ed8194669564. Report an issue: GitHub.