DEV Community

Cover image for Why Angular, Vue, and ESLint Can't Upgrade to TypeScript 7.0 (Yet) — And Why TS 7.1 Changes Everything
The Modern Web profile image mehdi
mehdi for The Modern Web

Posted on

Why Angular, Vue, and ESLint Can't Upgrade to TypeScript 7.0 (Yet) — And Why TS 7.1 Changes Everything

#typescript #angular #javascript #webdev

[!NOTE]

Summary: TypeScript 7.0 shipped with a brand-new native compiler core (tsgo). However, if you try upgrading your Angular 22, Vue, Svelte, or ESLint project to TypeScript 7.0 today, your build will fail with ERESOLVE peer dependency locks. In this article, we explore the deep technical reasons why frontend frameworks can't use TS 7.0 yet, what an AST (Abstract Syntax Tree) compiler plugin is, and why TypeScript 7.1 is the release everyone is waiting for.

The Hype Around TypeScript 7.0

When Microsoft released TypeScript 7.0, the web development community was buzzing. Featuring a brand-new native compiler engine (often called tsgo), TS 7.0 promises 8x–12x faster compilation speeds.

Naturally, developers running npm install typescript@latest in their Angular 22, Vue, or React projects expect an instant speed boost.

Instead, running npm install typescript@^7.0.0 in an Angular 22 project throws a hard error:

npm error code ERESOLVE unable to resolve dependency tree
npm error Could not resolve dependency:
npm error peer typescript@">=6.0 <6.1" from @angular/compiler-cli@22.1.0
npm error peer typescript@">=6.0 <6.1" from @angular/build@22.1.3
npm error peer typescript@">=4.8.4 <6.1.0" from @typescript-eslint/parser@8.66.0
Enter fullscreen mode Exit fullscreen mode

Why are Angular, Vue, Svelte, and typescript-eslint explicitly locking out TypeScript 7.0?

Plain tsc vs. Framework Compilers: The AST Connection

To understand why standard projects can upgrade TypeScript easily while frameworks cannot, we need to look at how compilers parse code.

1. Plain TypeScript Projects (React, Node.js, Express)

For a standard Node.js or React app, TypeScript (tsc) acts as a plain transpiler. It reads your code, strips type annotations (: string, : number), and emits .js files.

For these projects, upgrading TypeScript major versions is transparent.

2. Framework Compilers (Angular ngc, Vue SFC, Svelte, ESLint)

Frameworks do not use TypeScript as a plain transpiler. They hook directly into TypeScript's internal Programmatic Compiler API.

Source File: tab1.page.ts
 └── AST Parser (ts.createSourceFile)
      ├── ClassDeclaration: Tab1Page
      │    └── Decorator: @Component({ templateUrl: 'tab1.page.html' })
      │         └── Inline HTML Template Validator & Code Rewriter
Enter fullscreen mode Exit fullscreen mode

What is an AST (Abstract Syntax Tree)?

An AST is a tree-like object structure representing your code.

Angular's compiler (@angular/compiler-cli / ngc) parses your HTML templates and correlates every element binding, event listener, and pipe directly against TypeScript AST nodes. Before TypeScript emits JavaScript, Angular's compiler rewrites AST nodes to transform @Component() decorators into Angular instructions (ɵɵdefineComponent()).

The Missing Piece in TypeScript 7.0

When Microsoft built TypeScript 7.0's native engine (tsgo), they focused on CLI compilation speed (tsc). However, TypeScript 7.0 omitted the public Programmatic Compiler API (ts.createProgram, ts.transform, ts.factory).

Because tools like @angular/compiler-cli, @vue/compiler-sfc, svelte-preprocess, and typescript-eslint rely on this Compiler API to parse and rewrite AST nodes, none of these tools can run on TypeScript 7.0 without breaking.

As a result, framework maintainers deliberately set strict peer dependency locks:

"peerDependencies": {
  "typescript": ">=6.0 <6.1"
}
Enter fullscreen mode Exit fullscreen mode

Enter TypeScript 7.1: The Bridge for Toolmakers

The TypeScript team at Microsoft recognized this ecosystem blocker immediately. Work is already underway on TypeScript 7.1 (tracked on GitHub under issue #63703 - TypeScript 7.1 Iteration Plan).

What TS 7.1 Delivers:

  1. Stable Programmatic Compiler API: Exposing the AST parser and transformer factory functions to external tools.
  2. Framework Alignment: Enabling Angular, Vue, Svelte, and ESLint to leverage native tsgo speed without breaking custom AST transformations.

TypeScript 7.1 is targeted for release in Autumn 2026.

Will Upgrading to TS 7.1 Require Massive Framework Rewrites?

No. Because Microsoft and core framework maintainers (including the Angular team via GitHub issue #69719) are collaborating on the TS 7.1 Compiler API spec, framework adoption will be fast and smooth.

When TypeScript 7.1 lands, Angular will backport support into a minor release (e.g., Angular 22.2 or 22.3), allowing you to upgrade cleanly with:

npx ng update @angular/cli @angular/core
Enter fullscreen mode Exit fullscreen mode

Key Takeaways for Developers

  • Stay on TypeScript ~6.0.3: If you are building on Angular 22, keep your package.json pinned to the officially supported range (~6.0.3).
  • Do NOT force --legacy-peer-deps: Forcing TS 7.0 into an Angular 22 build will cause compiler transformer crashes.
  • Look Ahead to TS 7.1: The entire frontend ecosystem is preparing for TypeScript 7.1 in Autumn 2026.

Top comments (0)