Skip to content

Conversation

@fahrigedik
Copy link
Member

@fahrigedik fahrigedik commented Jul 23, 2025

Description

Resolves #23242

This PR migrates ABP Angular templates and packages to Angular's new esbuild-based build system introduced in Angular 17+ and fully supported in Angular 20.

Changes Made

Template Migrations (3 templates):

  • templates/app/angular: Migrated from @angular-devkit/build-angular:browser to @angular-devkit/build-angular:application
  • templates/app-nolayers/angular: Migrated from @angular-devkit/build-angular:browser to @angular-devkit/build-angular:application
  • templates/module/angular: Migrated dev-app from @angular-devkit/build-angular:browser to @angular-devkit/build-angular:application

Package Updates (14 packages):

Updated TypeScript configuration for all ABP Angular packages:

  • core, components, feature-management, oauth, account-core, account, permission-management, theme-basic, theme-shared, tenant-management, setting-management, identity, source-code-requirements, schematics

Key Configuration Changes:

  • Builder: browserapplication
  • Main: mainbrowser (new property name)
  • Polyfills: String → Array format
  • TypeScript: es2018es2020, added esModuleInterop: true
  • Module: es2020esnext

Template File Updates:

  • Updated schematics template files to use es2020 instead of es2018

Benefits

  • Performance: Faster build times with esbuild
  • Modern: ESM (ES Modules) support with dynamic imports
  • Future-ready: Prepared for Angular 21+ updates
  • SSR Ready: Built-in SSR and prerendering capabilities
  • Hot Reload: Improved development experience

Breaking Changes

None - This is a non-breaking change that improves build performance and modernizes the build system.

Documentation

Reference: Angular Build System Migration Guide

Checklist

  • I fully tested it as developer / designer and created unit / integration tests
  • I documented it (or no need to document or I will create a separate documentation issue)

How to test it?
Run yarn build:all
Run yarn copy-to:app
✅ Both commands should complete successfully without any errors.

Switched build executor from 'browser' to 'application' and updated build options to use 'browser' and array format for 'polyfills'. Also removed unused options from the development configuration for cleaner setup.
Changed the 'lib' setting from 'es2018' to 'es2020' in all package tsconfig.lib.json files and updated tsconfig.base.json to use 'es2020'. Also added 'esModuleInterop' to tsconfig.base.json for improved module compatibility.
@fahrigedik fahrigedik added this to the 10.0-preview milestone Jul 29, 2025
@yagmurcelk yagmurcelk merged commit 556bd6c into dev Aug 6, 2025
2 of 3 checks passed
@yagmurcelk yagmurcelk deleted the issue-23242 branch August 6, 2025 08:10
@enisn enisn added the feature label Oct 2, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Angular - Migrate to New Esbuild-based Angular Builder

5 participants