ionic-team/ionic-framework · error · SchematicsException

Invalid builder for ${projectName}: ${buildConfig.builder}

Error message

Invalid builder for ${projectName}: ${buildConfig.builder}

What it means

Thrown by getAngularJson() when the project is treated as an application but its `architect.build.builder` is not one of the three supported values: `@angular-devkit/build-angular:browser` (Angular <=16), `@angular-devkit/build-angular:application` (Angular 17), or `@angular/build:application` (Angular 18+). The message echoes the offending builder string so you can see exactly what was rejected.

Source

Thrown at packages/angular/src/schematics/utils/config.ts:63

  return projectNames[0];
}

function getAngularJson(config: any, projectName: string): any | never {
  // eslint-disable-next-line no-prototype-builtins
  if (!config.projects.hasOwnProperty(projectName)) {
    throw new SchematicsException(`Could not find project: ${projectName}`);
  }

  const projectConfig = config.projects[projectName];
  if (isAngularBrowserProject(projectConfig)) {
    return projectConfig;
  }

  if (config.projectType !== 'application') {
    throw new SchematicsException(`Invalid projectType for ${projectName}: ${config.projectType}`);
  } else {
    const buildConfig = projectConfig.architect.build;
    throw new SchematicsException(`Invalid builder for ${projectName}: ${buildConfig.builder}`);
  }
}

export function addStyle(host: Tree, projectName: string, stylePath: string): void {
  const config = readConfig(host);
  const angularJson = getAngularJson(config, projectName);
  angularJson.architect.build.options.styles.push({
    input: stylePath,
  });
  writeConfig(host, config);
}

export function addAsset(
  host: Tree,
  projectName: string,
  architect: string,
  asset: string | { glob: string; input: string; output: string }
): void {

View on GitHub (pinned to 625f9c38ad)

Solutions

  1. Open angular.json and read `projects[<name>].architect.build.builder` shown in the error message.
  2. Switch that builder to a supported value (e.g. `@angular/build:application` for Angular 18+).
  3. If you need the unsupported builder, upgrade `@ionic/angular` to a version that recognizes it, or apply the schematic's changes to angular.json manually.
  4. Re-run the schematic once the builder string matches a supported value.

Example fix

// before
"build": { "builder": "@angular-devkit/build-angular:browser-esbuild" }
// after
"build": { "builder": "@angular/build:application" }
Defensive patterns

Strategy: validation

Validate before calling

import { readFileSync } from 'fs';
const SUPPORTED = new Set([
  '@angular-devkit/build-angular:browser',
  '@angular-devkit/build-angular:application',
  '@angular/build:application',
]);
const angularJson = JSON.parse(readFileSync('angular.json', 'utf8'));
const builder = angularJson.projects?.[projectName]?.architect?.build?.builder;
if (!SUPPORTED.has(builder)) {
  throw new Error(`Unsupported builder '${builder}'. Use one of: ${[...SUPPORTED].join(', ')}`);
}

Type guard

const SUPPORTED_BUILDERS = new Set([
  '@angular-devkit/build-angular:browser',
  '@angular-devkit/build-angular:application',
  '@angular/build:application',
]);
function isSupportedBuilder(builder: unknown): boolean {
  return typeof builder === 'string' && SUPPORTED_BUILDERS.has(builder);
}

Prevention

When it happens

Trigger: The targeted application project's `architect.build.builder` is a server, prerender, dev-server, custom, or newer/older unsupported builder (e.g. `@angular-devkit/build-angular:browser-esbuild`, `:dev-server`, `:prerender`, `:server`).

Common situations: Using an experimental or custom esbuild/webpack builder; upgrading Angular to a version whose default builder string is not yet recognized by the installed Ionic version; targeting a build target that is actually for SSR/prerendering rather than the browser bundle.

Related errors


AI-assisted analysis of ionic-team/ionic-framework@625f9c38ad (2026-08-12). Data as JSON: /api/errors/411d91463d0c8470. Report an issue: GitHub.