Skip to content

Commit 562dc6a

Browse files
committed
fix(@angular-devkit/build-angular): prefer ES2015 entrypoints when application targets ES2019 or lower
Previously, we always consumed the ES2020 entrypoints, which caused issues in environments where the application compilation target is ES2019 or lower and ES2020 is not supported. This is because we only downlevel code when we target ES5 or below. - ES5 or below compilations, ES2015 entrypoints are used and their code is downlevelled to ES5. - ES2019 or below, ES2015 entrypoints are used and no downlevelling is involved. - ES2020 or later, ES2020 entrypoints are used. Closes #22270
1 parent 9bacba3 commit 562dc6a

File tree

3 files changed

+38
-10
lines changed

3 files changed

+38
-10
lines changed

packages/angular_devkit/build_angular/src/builders/browser/specs/lazy-module_spec.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -152,7 +152,7 @@ describe('Browser Builder lazy modules', () => {
152152
const { files } = await browserBuild(architect, host, target);
153153
expect(files['src_one_ts.js']).not.toBeUndefined();
154154
expect(files['src_two_ts.js']).not.toBeUndefined();
155-
expect(files['default-node_modules_angular_common_fesm2020_http_mjs.js']).toBeDefined();
155+
expect(files['default-node_modules_angular_common_fesm2015_http_mjs.js']).toBeDefined();
156156
});
157157

158158
it(`supports disabling the common bundle`, async () => {
@@ -165,6 +165,6 @@ describe('Browser Builder lazy modules', () => {
165165
const { files } = await browserBuild(architect, host, target, { commonChunk: false });
166166
expect(files['src_one_ts.js']).not.toBeUndefined();
167167
expect(files['src_two_ts.js']).not.toBeUndefined();
168-
expect(files['default-node_modules_angular_common_fesm2020_http_mjs.js']).toBeUndefined();
168+
expect(files['default-node_modules_angular_common_fesm2015_http_mjs.js']).toBeUndefined();
169169
});
170170
});

packages/angular_devkit/build_angular/src/webpack/configs/common.ts

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -38,14 +38,24 @@ import {
3838
externalizePackages,
3939
getCacheSettings,
4040
getInstrumentationExcludedPaths,
41+
getMainFieldsAndConditionNames,
4142
getOutputHashFormat,
4243
getStatsOptions,
4344
globalScriptsByBundleName,
4445
} from '../utils/helpers';
4546

4647
// eslint-disable-next-line max-lines-per-function
4748
export async function getCommonConfig(wco: WebpackConfigOptions): Promise<Configuration> {
48-
const { root, projectRoot, buildOptions, tsConfig, projectName, sourceRoot, tsConfigPath } = wco;
49+
const {
50+
root,
51+
projectRoot,
52+
buildOptions,
53+
tsConfig,
54+
projectName,
55+
sourceRoot,
56+
tsConfigPath,
57+
scriptTarget,
58+
} = wco;
4959
const {
5060
cache,
5161
codeCoverage,
@@ -266,7 +276,7 @@ export async function getCommonConfig(wco: WebpackConfigOptions): Promise<Config
266276
new JavaScriptOptimizerPlugin({
267277
define: buildOptions.aot ? GLOBAL_DEFS_FOR_TERSER_WITH_AOT : GLOBAL_DEFS_FOR_TERSER,
268278
sourcemap: scriptsSourceMap,
269-
target: wco.scriptTarget,
279+
target: scriptTarget,
270280
keepNames: !allowMangle || isPlatformServer,
271281
removeLicenses: buildOptions.extractLicenses,
272282
advanced: buildOptions.buildOptimizer,
@@ -297,18 +307,15 @@ export async function getCommonConfig(wco: WebpackConfigOptions): Promise<Config
297307
devtool: false,
298308
target: [
299309
isPlatformServer ? 'node' : 'web',
300-
tsConfig.options.target === ScriptTarget.ES5 ? 'es5' : 'es2015',
310+
scriptTarget === ScriptTarget.ES5 ? 'es5' : 'es2015',
301311
],
302312
profile: buildOptions.statsJson,
303313
resolve: {
304314
roots: [projectRoot],
305315
extensions: ['.ts', '.tsx', '.mjs', '.js'],
306316
symlinks: !buildOptions.preserveSymlinks,
307317
modules: [tsConfig.options.baseUrl || projectRoot, 'node_modules'],
308-
mainFields: isPlatformServer
309-
? ['es2015', 'module', 'main']
310-
: ['es2020', 'es2015', 'browser', 'module', 'main'],
311-
conditionNames: isPlatformServer ? ['es2015', '...'] : ['es2020', 'es2015', '...'],
318+
...getMainFieldsAndConditionNames(scriptTarget, isPlatformServer),
312319
},
313320
resolveLoader: {
314321
symlinks: !buildOptions.preserveSymlinks,
@@ -383,7 +390,7 @@ export async function getCommonConfig(wco: WebpackConfigOptions): Promise<Config
383390
loader: require.resolve('../../babel/webpack-loader'),
384391
options: {
385392
cacheDirectory: (cache.enabled && path.join(cache.path, 'babel-webpack')) || false,
386-
scriptTarget: wco.scriptTarget,
393+
scriptTarget,
387394
aot: buildOptions.aot,
388395
optimize: buildOptions.buildOptimizer,
389396
instrumentCode: codeCoverage

packages/angular_devkit/build_angular/src/webpack/utils/helpers.ts

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { createHash } from 'crypto';
1111
import { existsSync } from 'fs';
1212
import glob from 'glob';
1313
import * as path from 'path';
14+
import { ScriptTarget } from 'typescript';
1415
import type { Configuration, WebpackOptionsNormalized } from 'webpack';
1516
import {
1617
AssetPatternClass,
@@ -298,3 +299,23 @@ export function getStatsOptions(verbose = false): WebpackStatsOptions {
298299
? { ...webpackOutputOptions, ...verboseWebpackOutputOptions }
299300
: webpackOutputOptions;
300301
}
302+
303+
export function getMainFieldsAndConditionNames(
304+
target: ScriptTarget,
305+
platformServer: boolean,
306+
): Pick<WebpackOptionsNormalized['resolve'], 'mainFields' | 'conditionNames'> {
307+
const mainFields = platformServer
308+
? ['es2015', 'module', 'main']
309+
: ['es2015', 'browser', 'module', 'main'];
310+
const conditionNames = ['es2015', '...'];
311+
312+
if (target >= ScriptTarget.ES2020) {
313+
mainFields.unshift('es2020');
314+
conditionNames.unshift('es2020');
315+
}
316+
317+
return {
318+
mainFields,
319+
conditionNames,
320+
};
321+
}

0 commit comments

Comments
 (0)