TypeScript compiler options "target" and "useDefineForClassF

Error message

TypeScript compiler options "target" and "useDefineForClassFields" are set to "ES2022" and "false" respectively by the Angular CLI. To control ECMA version and features use the Browserslist configuration. For more information, see https://angular.dev/tools/cli/build#configuring-browser-compatibility
NOTE: You can set the "target" to "ES2022" in the project's tsconfig to remove this warning.

What it means

The Angular CLI build warns that it forcibly sets the TypeScript compiler options "target" to ES2022 and "useDefineForClassFields" to false (unless the user already defined the latter) because Browserslist controls the actual output compatibility. The warning tells you how to silence it and where to control ECMA features instead.

Source

Thrown at packages/angular_devkit/build_angular/src/tools/webpack/plugins/typescript.ts:38

  const optimize = buildOptions.optimization.scripts;

  const compilerOptions: CompilerOptions = {
    sourceMap: buildOptions.sourceMap.scripts,
    declaration: false,
    declarationMap: false,
    // Disable removing of comments as TS is quite aggressive with these and can
    // remove important annotations, such as /* @__PURE__ */.
    removeComments: false,
  };

  if (tsConfig.options.target === undefined || tsConfig.options.target < ScriptTarget.ES2022) {
    compilerOptions.target = ScriptTarget.ES2022;
    // If 'useDefineForClassFields' is already defined in the users project leave the value as is.
    // Otherwise fallback to false due to https://github.com/microsoft/TypeScript/issues/45995
    // which breaks the deprecated `@Effects` NGRX decorator and potentially other existing code as well.
    compilerOptions.useDefineForClassFields ??= false;

    wco.logger.warn(
      'TypeScript compiler options "target" and "useDefineForClassFields" are set to "ES2022" and ' +
        '"false" respectively by the Angular CLI. To control ECMA version and features use the Browserslist configuration. ' +
        'For more information, see https://angular.dev/tools/cli/build#configuring-browser-compatibility\n' +
        `NOTE: You can set the "target" to "ES2022" in the project's tsconfig to remove this warning.`,
    );
  }

  if (buildOptions.preserveSymlinks !== undefined) {
    compilerOptions.preserveSymlinks = buildOptions.preserveSymlinks;
  }

  const fileReplacements: Record<string, string> = {};
  if (buildOptions.fileReplacements) {
    for (const replacement of buildOptions.fileReplacements) {
      fileReplacements[replacement.replace] = replacement.with;
    }
  }

View on GitHub (pinned to bb72145f9a)

Solutions

Set "target": "ES2022" (and optionally "useDefineForClassFields": true/false explicitly) in the project's tsconfig to remove the warning.
Control ECMA version/features for output via Browserslist configuration (.browserslistrc) instead of tsconfig target.
If you rely on defineProperty class-field semantics, explicitly set "useDefineForClassFields": true and migrate away from deprecated decorators (e.g. NGRX @Effects).

Example fix

// before (tsconfig.json)
{ "compilerOptions": { "target": "ES2020" } }
// after
{ "compilerOptions": { "target": "ES2022", "useDefineForClassFields": false } }

Defensive patterns

Strategy: validation

Validate before calling

const tsconfig = require('./tsconfig.json');
if (tsconfig.compilerOptions?.target !== 'ES2022') {
  console.warn('Set compilerOptions.target to ES2022 to align with Angular CLI defaults and silence the warning.');
}

Prevention

Always set "target": "ES2022" explicitly in new Angular tsconfigs.
Use .browserslistrc for browser compatibility instead of lowering tsconfig target.
Explicitly declare useDefineForClassFields so the CLI never has to guess (matters for NGRX @Effects).

When it happens

Trigger: Running an Angular build/dev-server where the project's tsconfig does not set "target": "ES2022" (or the CLI had to apply useDefineForClassFields: false), in createIvyPlugin via getCommonConfig webpack configuration.

Common situations: Upgrading an older Angular workspace whose tsconfig still targets ES2015/ES2020; new projects generated before the ES2022 default; teams surprised that class fields use assignment semantics instead of defineProperty (TypeScript issue #45995 workaround for legacy NGRX @Effects decorators).

Related errors

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