feat(@schematics/angular): use TypeScript module preserve option for new projects

clydin · alan-agius4 · commit 03180fe03586 · 2025-03-06T17:55:28.000+01:00
Newly generated projects will now use the `preserve` value for the `module` option within the TypeScript configuration for the workspace (`tsconfig.json`). This value was added in TypeScript 5.4 and is intended to model the behavior of modern bundlers such as used in the default `application` builder. This option value also has the advantage of automatically enabling `esModuleInterop` and setting `moduleResolution` to `bundler` which are the currently generated values for new projects. This allows explicit use of these options to be removed from the generated file. The `resolveJsonModule` option is also enabled with `preserve` which removes the need for developers to manually add it if JSON files are imported. JSON file imports are fully support including unused property treeshaking with named imports in the `application` builder. Additional details on the option can be found here: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-5-4.html#support-for-require-calls-in---moduleresolution-bundler-and---module-preserve
diff --git a/packages/schematics/angular/workspace/files/tsconfig.json.template b/packages/schematics/angular/workspace/files/tsconfig.json.template
@@ -11,12 +11,10 @@
     "noFallthroughCasesInSwitch": true,<% } %>
     "skipLibCheck": true,
     "isolatedModules": true,
-    "esModuleInterop": true,
     "experimentalDecorators": true,
-    "moduleResolution": "bundler",
     "importHelpers": true,
     "target": "ES2022",
-    "module": "ES2022"
+    "module": "preserve"
   },
   "angularCompilerOptions": {
     "enableI18nLegacyMessageIdFormat": false<% if (strict) { %>,
