From 23c0a9fc0df1e32677752decf807013bab32eb49 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Tue, 17 Dec 2024 17:58:35 +0000 Subject: [PATCH 1/3] build: improve ts_project hybrid interop with node modules Currently the interop resulting target of a `ts_project` ends up not necessarily working at runtime. This may be the case because a consuming Node program may end up with mixes of `node_modules` dependencies from `rules_nodejs` (old) and `rules_js` (new). This sounds fine at first glance, but in practice can break very subtly because: * Rules NodeJS leverages the linker, creating `node_module` directories outside of Bazel, at runtime. These don't depend on symlink resolving. * Rules JS puts real node module folders via Bazel actions. These rely on `pnpm` non-hoisting layout, and symlink resolving. As we can see there is a hard conflict with symlinks. They need to be enabled with the new toolchain, but the other one doesn't enable symlink resolution, and enabling is not possible as we'd otherwise risk escaping the sandbox and cause even more subtle errors. A good compromise solution is to automatically drop the `rules_js` node module files/folder in the interop-`rules_nodejs` target and instead brining in the equivalent `@npm//` dependencies from `rules_nodejs`. This kind of keeps the logic similar to when not using `rules_js` or the interop, and enables the simplest & safest mental model; and it works compared to other solutions I tried with symlinking. Notably, we can't keep both node module variants as the linker doesn't override existing node module files from e.g. rules_js then (and would break then). --- .../angular_devkit/build_angular/BUILD.bazel | 153 +++++++++--------- .../angular_devkit/build_webpack/BUILD.bazel | 1 + .../angular_devkit/build_webpack/index.ts | 9 ++ tools/interop.bzl | 31 +++- tsconfig.json | 1 + 5 files changed, 116 insertions(+), 79 deletions(-) create mode 100644 packages/angular_devkit/build_webpack/index.ts diff --git a/packages/angular_devkit/build_angular/BUILD.bazel b/packages/angular_devkit/build_angular/BUILD.bazel index fd803c9ba7f2..e3a13c0085a0 100644 --- a/packages/angular_devkit/build_angular/BUILD.bazel +++ b/packages/angular_devkit/build_angular/BUILD.bazel @@ -6,6 +6,7 @@ load("@npm//@angular/build-tooling/bazel/api-golden:index.bzl", "api_golden_test_npm_package") load("@npm//@bazel/jasmine:index.bzl", "jasmine_node_test") load("//tools:defaults.bzl", "pkg_npm", "ts_library") +load("//tools:interop.bzl", "ts_project") load("//tools:ts_json_schema.bzl", "ts_json_schema") licenses(["notice"]) @@ -77,9 +78,8 @@ ts_json_schema( src = "src/builders/web-test-runner/schema.json", ) -ts_library( +ts_project( name = "build_angular", - package_name = "@angular-devkit/build-angular", srcs = glob( include = [ "src/**/*.ts", @@ -118,87 +118,88 @@ ts_library( "builders.json", "package.json", ], - module_name = "@angular-devkit/build-angular", - module_root = "src/index.d.ts", - deps = [ + interop_deps = [ "//packages/angular/build", "//packages/angular/build:private", "//packages/angular/ssr", - "//packages/angular_devkit/architect", "//packages/angular_devkit/build_webpack", "//packages/angular_devkit/core", "//packages/angular_devkit/core/node", "//packages/ngtools/webpack", - "@npm//@ampproject/remapping", - "@npm//@angular/common", - "@npm//@angular/compiler-cli", - "@npm//@angular/core", - "@npm//@angular/localize", - "@npm//@angular/platform-server", - "@npm//@angular/service-worker", - "@npm//@babel/core", - "@npm//@babel/generator", - "@npm//@babel/helper-annotate-as-pure", - "@npm//@babel/helper-split-export-declaration", - "@npm//@babel/plugin-transform-async-generator-functions", - "@npm//@babel/plugin-transform-async-to-generator", - "@npm//@babel/plugin-transform-runtime", - "@npm//@babel/preset-env", - "@npm//@babel/runtime", - "@npm//@discoveryjs/json-ext", - "@npm//@types/babel__core", - "@npm//@types/browser-sync", - "@npm//@types/karma", - "@npm//@types/less", - "@npm//@types/loader-utils", - "@npm//@types/node", - "@npm//@types/picomatch", - "@npm//@types/semver", - "@npm//@types/watchpack", - "@npm//@vitejs/plugin-basic-ssl", - "@npm//@web/test-runner", - "@npm//ajv", - "@npm//ansi-colors", - "@npm//autoprefixer", - "@npm//babel-loader", - "@npm//browserslist", - "@npm//copy-webpack-plugin", - "@npm//css-loader", - "@npm//esbuild", - "@npm//esbuild-wasm", - "@npm//fast-glob", - "@npm//http-proxy-middleware", - "@npm//istanbul-lib-instrument", - "@npm//jsonc-parser", - "@npm//karma", - "@npm//karma-source-map-support", - "@npm//less", - "@npm//less-loader", - "@npm//license-webpack-plugin", - "@npm//loader-utils", - "@npm//mini-css-extract-plugin", - "@npm//ng-packagr", - "@npm//open", - "@npm//ora", - "@npm//piscina", - "@npm//postcss", - "@npm//postcss-loader", - "@npm//resolve-url-loader", - "@npm//rxjs", - "@npm//sass", - "@npm//sass-loader", - "@npm//semver", - "@npm//source-map-loader", - "@npm//source-map-support", - "@npm//terser", - "@npm//tree-kill", - "@npm//tslib", - "@npm//typescript", - "@npm//webpack", - "@npm//webpack-dev-middleware", - "@npm//webpack-dev-server", - "@npm//webpack-merge", - "@npm//webpack-subresource-integrity", + ], + module_name = "@angular-devkit/build-angular", + deps = [ + "//:root_modules/@ampproject/remapping", + "//:root_modules/@angular/common", + "//:root_modules/@angular/compiler-cli", + "//:root_modules/@angular/core", + "//:root_modules/@angular/localize", + "//:root_modules/@angular/platform-server", + "//:root_modules/@angular/service-worker", + "//:root_modules/@babel/core", + "//:root_modules/@babel/generator", + "//:root_modules/@babel/helper-annotate-as-pure", + "//:root_modules/@babel/helper-split-export-declaration", + "//:root_modules/@babel/plugin-transform-async-generator-functions", + "//:root_modules/@babel/plugin-transform-async-to-generator", + "//:root_modules/@babel/plugin-transform-runtime", + "//:root_modules/@babel/preset-env", + "//:root_modules/@babel/runtime", + "//:root_modules/@discoveryjs/json-ext", + "//:root_modules/@types/babel__core", + "//:root_modules/@types/browser-sync", + "//:root_modules/@types/karma", + "//:root_modules/@types/less", + "//:root_modules/@types/loader-utils", + "//:root_modules/@types/node", + "//:root_modules/@types/picomatch", + "//:root_modules/@types/semver", + "//:root_modules/@types/watchpack", + "//:root_modules/@vitejs/plugin-basic-ssl", + "//:root_modules/@web/test-runner", + "//:root_modules/ajv", + "//:root_modules/ansi-colors", + "//:root_modules/autoprefixer", + "//:root_modules/babel-loader", + "//:root_modules/browserslist", + "//:root_modules/copy-webpack-plugin", + "//:root_modules/css-loader", + "//:root_modules/esbuild", + "//:root_modules/esbuild-wasm", + "//:root_modules/fast-glob", + "//:root_modules/http-proxy-middleware", + "//:root_modules/istanbul-lib-instrument", + "//:root_modules/jsonc-parser", + "//:root_modules/karma", + "//:root_modules/karma-source-map-support", + "//:root_modules/less", + "//:root_modules/less-loader", + "//:root_modules/license-webpack-plugin", + "//:root_modules/loader-utils", + "//:root_modules/mini-css-extract-plugin", + "//:root_modules/ng-packagr", + "//:root_modules/open", + "//:root_modules/ora", + "//:root_modules/piscina", + "//:root_modules/postcss", + "//:root_modules/postcss-loader", + "//:root_modules/resolve-url-loader", + "//:root_modules/rxjs", + "//:root_modules/sass", + "//:root_modules/sass-loader", + "//:root_modules/semver", + "//:root_modules/source-map-loader", + "//:root_modules/source-map-support", + "//:root_modules/terser", + "//:root_modules/tree-kill", + "//:root_modules/tslib", + "//:root_modules/typescript", + "//:root_modules/webpack", + "//:root_modules/webpack-dev-middleware", + "//:root_modules/webpack-dev-server", + "//:root_modules/webpack-merge", + "//:root_modules/webpack-subresource-integrity", + "//packages/angular_devkit/architect", ], ) diff --git a/packages/angular_devkit/build_webpack/BUILD.bazel b/packages/angular_devkit/build_webpack/BUILD.bazel index e03c86c07be1..5df72c9adf9f 100644 --- a/packages/angular_devkit/build_webpack/BUILD.bazel +++ b/packages/angular_devkit/build_webpack/BUILD.bazel @@ -32,6 +32,7 @@ ts_library( "src/**/*_spec.ts", ], ) + [ + "index.ts", "//packages/angular_devkit/build_webpack:src/builders/webpack-dev-server/schema.ts", "//packages/angular_devkit/build_webpack:src/builders/webpack/schema.ts", ], diff --git a/packages/angular_devkit/build_webpack/index.ts b/packages/angular_devkit/build_webpack/index.ts new file mode 100644 index 000000000000..e6da94cc7ded --- /dev/null +++ b/packages/angular_devkit/build_webpack/index.ts @@ -0,0 +1,9 @@ +/** + * @license + * Copyright Google LLC All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.dev/license + */ + +export * from './src/index'; diff --git a/tools/interop.bzl b/tools/interop.bzl index 01e4e00f705e..f0dd3ce765f0 100644 --- a/tools/interop.bzl +++ b/tools/interop.bzl @@ -42,6 +42,17 @@ def _ts_project_module_impl(ctx): runfiles = ctx.attr.dep[DefaultInfo].default_runfiles info = ctx.attr.dep[JsInfo] + # Filter runfiles to not `node_modules` from Aspect as this interop + # target is supposed to be used downstream by `rules_nodejs` consumers, + # and mixing pnpm-style node modules with linker node modules is incompatible. + filtered = [] + for f in runfiles.files.to_list(): + if f.short_path.startswith("node_modules/"): + continue + filtered.append(f) + + runfiles = ctx.runfiles(files = filtered) + providers = [ DefaultInfo( runfiles = runfiles, @@ -83,9 +94,21 @@ ts_project_module = rule( ) def ts_project(name, module_name = None, interop_deps = [], deps = [], testonly = False, **kwargs): + # Pull in the `rules_nodejs` variants of dependencies we know are "hybrid". This + # is necessary as we can't mix `npm/node_modules` from RNJS with the pnpm-style + # symlink-dependent node modules. In addition, we need to extract `_rjs` interop + # dependencies so that we can forward and capture the module mappings for runtime + # execution, with regards to first-party dependency linking. + rjs_modules_to_rnjs = [] + for d in deps: + if d.startswith("//:root_modules/"): + rjs_modules_to_rnjs.append(d.replace("//:root_modules/", "@npm//")) + if d.endswith("_rjs"): + rjs_modules_to_rnjs.append(d.replace("_rjs", "")) + ts_deps_interop( name = "%s_interop_deps" % name, - deps = interop_deps, + deps = [] + interop_deps + rjs_modules_to_rnjs, testonly = testonly, ) @@ -99,7 +122,7 @@ def ts_project(name, module_name = None, interop_deps = [], deps = [], testonly # worker for efficient, fast DX and avoiding Windows no-sandbox issues. supports_workers = 1, tsc_worker = "//tools:vanilla_ts_worker", - deps = ["%s_interop_deps" % name] + deps, + deps = [":%s_interop_deps" % name] + deps, **kwargs ) @@ -107,6 +130,8 @@ def ts_project(name, module_name = None, interop_deps = [], deps = [], testonly name = name, testonly = testonly, dep = "%s_rjs" % name, - deps = interop_deps, + # Forwarded dependencies for linker module mapping aspect. + # RJS deps can also transitively pull in module mappings from their `interop_deps`. + deps = [] + interop_deps + deps, module_name = module_name, ) diff --git a/tsconfig.json b/tsconfig.json index c11293fd8e48..c2c25b7e5fcb 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -27,6 +27,7 @@ "@angular-devkit/architect/*": ["./packages/angular_devkit/architect/*/index"], "@angular-devkit/build-webpack": ["./packages/angular_devkit/build_webpack"], "@angular-devkit/*": ["./packages/angular_devkit/*/src"], + "@angular/ssr": ["./packages/angular/ssr"], "@angular/*": ["./packages/angular/*/src"], "@angular/build/private": ["./packages/angular/build/src/private"], "@ngtools/webpack": ["./packages/ngtools/webpack/src"], From ccc480da0406033ca827be0716d95ac88f2df648 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Thu, 19 Dec 2024 14:06:19 +0000 Subject: [PATCH 2/3] build: migrate `build_angular` to `ts_project` This commit updates `build_angular` to the `rules_js` ts_project rule. Notably a few real type issues surfaced but previously didn't surface due to some unknown resolution issues that resulted in `never` types; where every possible value was assignable; so this change improves type safety and a TODO was left for the "brittle code fragment". --- .../npm_translate_lock_MzA5NzUwNzMx | 6 +- package.json | 1 + .../angular_devkit/build_angular/BUILD.bazel | 137 ++++++++++-------- .../angular_devkit/build_angular/index.ts | 9 ++ .../webpack/plugins/postcss-cli-resources.ts | 14 +- .../webpack/plugins/scripts-webpack-plugin.ts | 4 +- pnpm-lock.yaml | 4 +- tsconfig.json | 1 + yarn.lock | 3 +- 9 files changed, 107 insertions(+), 72 deletions(-) create mode 100644 packages/angular_devkit/build_angular/index.ts diff --git a/.aspect/rules/external_repository_action_cache/npm_translate_lock_MzA5NzUwNzMx b/.aspect/rules/external_repository_action_cache/npm_translate_lock_MzA5NzUwNzMx index 04aa705e5043..9164e7734e82 100755 --- a/.aspect/rules/external_repository_action_cache/npm_translate_lock_MzA5NzUwNzMx +++ b/.aspect/rules/external_repository_action_cache/npm_translate_lock_MzA5NzUwNzMx @@ -2,7 +2,7 @@ # Input hashes for repository rule npm_translate_lock(name = "npm2", pnpm_lock = "@//:pnpm-lock.yaml"). # This file should be checked into version control along with the pnpm-lock.yaml file. .npmrc=-2023857461 -package.json=-480869368 -pnpm-lock.yaml=874451555 +package.json=-897909042 +pnpm-lock.yaml=1784423746 pnpm-workspace.yaml=1711114604 -yarn.lock=1731700542 +yarn.lock=1048347990 diff --git a/package.json b/package.json index bd1f74498c28..f5d1519cad6b 100644 --- a/package.json +++ b/package.json @@ -85,6 +85,7 @@ "@rollup/plugin-node-resolve": "^13.0.5", "@stylistic/eslint-plugin": "^2.8.0", "@types/babel__core": "7.20.5", + "@types/babel__generator": "^7.6.8", "@types/browser-sync": "^2.27.0", "@types/express": "^4.16.0", "@types/http-proxy": "^1.17.4", diff --git a/packages/angular_devkit/build_angular/BUILD.bazel b/packages/angular_devkit/build_angular/BUILD.bazel index e3a13c0085a0..e2fd430e9d1b 100644 --- a/packages/angular_devkit/build_angular/BUILD.bazel +++ b/packages/angular_devkit/build_angular/BUILD.bazel @@ -5,7 +5,7 @@ load("@npm//@angular/build-tooling/bazel/api-golden:index.bzl", "api_golden_test_npm_package") load("@npm//@bazel/jasmine:index.bzl", "jasmine_node_test") -load("//tools:defaults.bzl", "pkg_npm", "ts_library") +load("//tools:defaults.bzl", "pkg_npm") load("//tools:interop.bzl", "ts_project") load("//tools:ts_json_schema.bzl", "ts_json_schema") @@ -93,6 +93,7 @@ ts_project( "src/testing/**/*.ts", ], ) + [ + "index.ts", "//packages/angular_devkit/build_angular:src/builders/app-shell/schema.ts", "//packages/angular_devkit/build_angular:src/builders/browser-esbuild/schema.ts", "//packages/angular_devkit/build_angular:src/builders/browser/schema.ts", @@ -147,6 +148,7 @@ ts_project( "//:root_modules/@babel/runtime", "//:root_modules/@discoveryjs/json-ext", "//:root_modules/@types/babel__core", + "//:root_modules/@types/babel__generator", "//:root_modules/@types/browser-sync", "//:root_modules/@types/karma", "//:root_modules/@types/less", @@ -203,7 +205,7 @@ ts_project( ], ) -ts_library( +ts_project( name = "build_angular_test_lib", testonly = True, srcs = glob( @@ -215,15 +217,17 @@ ts_library( ], ), data = glob(["test/**/*"]), - deps = [ - ":build_angular", - ":build_angular_test_utils", - "//packages/angular_devkit/architect/testing", + interop_deps = [ "//packages/angular_devkit/core", - "@npm//fast-glob", - "@npm//prettier", - "@npm//typescript", - "@npm//webpack", + ], + deps = [ + ":build_angular_rjs", + ":build_angular_test_utils_rjs", + "//:root_modules/fast-glob", + "//:root_modules/prettier", + "//:root_modules/typescript", + "//:root_modules/webpack", + "//packages/angular_devkit/architect/testing:testing_rjs", ], ) @@ -268,7 +272,7 @@ api_golden_test_npm_package( # Large build_angular specs -ts_library( +ts_project( name = "build_angular_test_utils", testonly = True, srcs = glob( @@ -281,17 +285,19 @@ ts_library( ], ), data = glob(["test/**/*"]), - tsconfig = "//:tsconfig-test.json", - deps = [ - ":build_angular", + interop_deps = [ "//modules/testing/builder", "//packages/angular/build", "//packages/angular/build:private", - "//packages/angular_devkit/architect", - "//packages/angular_devkit/architect/node", - "//packages/angular_devkit/architect/testing", "//packages/angular_devkit/core", "//packages/angular_devkit/core/node", + ], + deps = [ + ":build_angular_rjs", + "//:root_modules/@types/jasmine", + "//packages/angular_devkit/architect:architect_rjs", + "//packages/angular_devkit/architect/node:node_rjs", + "//packages/angular_devkit/architect/testing:testing_rjs", "@npm//rxjs", ], ) @@ -302,12 +308,14 @@ LARGE_SPECS = { "shards": 10, "size": "large", "flaky": True, - "extra_deps": [ + "extra_interop_deps": [ "//packages/angular_devkit/build_webpack", - "@npm//@types/http-proxy", - "@npm//http-proxy", - "@npm//puppeteer", - "@npm//undici", + ], + "extra_deps": [ + "//:root_modules/@types/http-proxy", + "//:root_modules/http-proxy", + "//:root_modules/puppeteer", + "//:root_modules/undici", ], }, "extract-i18n": {}, @@ -316,21 +324,21 @@ LARGE_SPECS = { "size": "large", "flaky": True, "extra_deps": [ - "@npm//karma", - "@npm//karma-chrome-launcher", - "@npm//karma-coverage", - "@npm//karma-jasmine", - "@npm//karma-jasmine-html-reporter", - "@npm//puppeteer", - "@npm//webpack", + "//:root_modules/karma", + "//:root_modules/karma-chrome-launcher", + "//:root_modules/karma-coverage", + "//:root_modules/karma-jasmine", + "//:root_modules/karma-jasmine-html-reporter", + "//:root_modules/puppeteer", + "//:root_modules/webpack", ], }, "protractor": { "extra_deps": [ - "@npm//jasmine-spec-reporter", - "@npm//protractor", - "@npm//puppeteer", - "@npm//ts-node", + "//:root_modules/jasmine-spec-reporter", + "//:root_modules/protractor", + "//:root_modules/puppeteer", + "//:root_modules/ts-node", ], # NB: does not run on rbe because webdriver manager uses an absolute path to chromedriver "tags": ["no-remote-exec"], @@ -340,7 +348,7 @@ LARGE_SPECS = { "server": { "size": "large", "extra_deps": [ - "@npm//@angular/animations", + "//:root_modules/@angular/animations", ], }, "ng-packagr": {}, @@ -349,55 +357,60 @@ LARGE_SPECS = { "size": "large", "flaky": True, "extra_deps": [ - "@npm//@angular/animations", - "@npm//@angular/material", + "//:root_modules/@angular/animations", + "//:root_modules/@angular/material", ], }, "prerender": {}, "browser-esbuild": {}, "ssr-dev-server": { - "extra_deps": [ - "@npm//@types/browser-sync", - "@npm//browser-sync", - "@npm//express", - "@npm//undici", + "extra_interop_deps": [ "//packages/angular/ssr/node", ], + "extra_deps": [ + "//:root_modules/@types/browser-sync", + "//:root_modules/browser-sync", + "//:root_modules/express", + "//:root_modules/undici", + ], }, } [ - ts_library( + ts_project( name = "build_angular_" + spec + "_test_lib", testonly = True, srcs = glob(["src/builders/" + spec + "/**/*_spec.ts"]), - tsconfig = "//:tsconfig-test.json", - deps = [ + interop_deps = [ # Dependencies needed to compile and run the specs themselves. - ":build_angular", - ":build_angular_test_utils", + "//packages/angular_devkit/core", + "//packages/angular_devkit/core/node", "//modules/testing/builder", "//packages/angular/build", "//packages/angular/build:private", - "//packages/angular_devkit/architect", - "//packages/angular_devkit/architect/node", - "//packages/angular_devkit/architect/testing", - "//packages/angular_devkit/core", - "//packages/angular_devkit/core/node", + ] + LARGE_SPECS[spec].get("extra_interop_deps", []), + deps = [ + # Dependencies needed to compile and run the specs themselves. + ":build_angular_rjs", + ":build_angular_test_utils_rjs", + "//packages/angular_devkit/architect:architect_rjs", + "//packages/angular_devkit/architect/node:node_rjs", + "//packages/angular_devkit/architect/testing:testing_rjs", # Base dependencies for the application in hello-world-app. # Some tests also require extra dependencies. - "@npm//@angular/common", - "@npm//@angular/compiler", - "@npm//@angular/compiler-cli", - "@npm//@angular/core", - "@npm//@angular/platform-browser", - "@npm//@angular/platform-browser-dynamic", - "@npm//@angular/router", - "@npm//rxjs", - "@npm//tslib", - "@npm//typescript", - "@npm//zone.js", + "//:root_modules/@angular/common", + "//:root_modules/@angular/compiler", + "//:root_modules/@angular/compiler-cli", + "//:root_modules/@angular/core", + "//:root_modules/@angular/platform-browser", + "//:root_modules/@angular/platform-browser-dynamic", + "//:root_modules/@angular/router", + "//:root_modules/rxjs", + "//:root_modules/tslib", + "//:root_modules/typescript", + "//:root_modules/zone.js", + "//:root_modules/@types/jasmine", ] + LARGE_SPECS[spec].get("extra_deps", []), ) for spec in LARGE_SPECS diff --git a/packages/angular_devkit/build_angular/index.ts b/packages/angular_devkit/build_angular/index.ts new file mode 100644 index 000000000000..e6da94cc7ded --- /dev/null +++ b/packages/angular_devkit/build_angular/index.ts @@ -0,0 +1,9 @@ +/** + * @license + * Copyright Google LLC All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.dev/license + */ + +export * from './src/index'; diff --git a/packages/angular_devkit/build_angular/src/tools/webpack/plugins/postcss-cli-resources.ts b/packages/angular_devkit/build_angular/src/tools/webpack/plugins/postcss-cli-resources.ts index 3dde32a42cc8..a59d009072d1 100644 --- a/packages/angular_devkit/build_angular/src/tools/webpack/plugins/postcss-cli-resources.ts +++ b/packages/angular_devkit/build_angular/src/tools/webpack/plugins/postcss-cli-resources.ts @@ -115,10 +115,16 @@ export default function (options?: PostcssCliResourcesOptions): Plugin { return; } - let outputPath = interpolateName({ resourcePath: result }, filename(result), { - content, - context: loader.context || loader.rootContext, - }).replace(/\\|\//g, '-'); + let outputPath = interpolateName( + // TODO: Revisit. Previously due to lack of type safety, this object + // was fine, but in practice it doesn't match the type of the loader context. + { resourcePath: result } as Parameters[0], + filename(result), + { + content, + context: loader.context || loader.rootContext, + }, + ).replace(/\\|\//g, '-'); if (resourcesOutputPath) { outputPath = path.posix.join(resourcesOutputPath, outputPath); diff --git a/packages/angular_devkit/build_angular/src/tools/webpack/plugins/scripts-webpack-plugin.ts b/packages/angular_devkit/build_angular/src/tools/webpack/plugins/scripts-webpack-plugin.ts index 6d3de8a51129..185cafdfb25d 100644 --- a/packages/angular_devkit/build_angular/src/tools/webpack/plugins/scripts-webpack-plugin.ts +++ b/packages/angular_devkit/build_angular/src/tools/webpack/plugins/scripts-webpack-plugin.ts @@ -194,7 +194,9 @@ export class ScriptsWebpackPlugin { const asset = compilation.getAsset(assetName); if (asset) { const interpolatedFilename = interpolateName( - { resourcePath: 'scripts.js' }, + // TODO: Revisit. Previously due to lack of type safety, this object + // was fine, but in practice it doesn't match the type of the loader context. + { resourcePath: 'scripts.js' } as Parameters[0], assetName, { content: asset.source.source() }, ); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b1ac76d4ecc8..71abad177d3e 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -142,6 +142,9 @@ importers: '@types/babel__core': specifier: 7.20.5 version: 7.20.5 + '@types/babel__generator': + specifier: ^7.6.8 + version: 7.6.8 '@types/browser-sync': specifier: ^2.27.0 version: 2.29.0 @@ -2084,7 +2087,6 @@ packages: /@bazel/typescript@5.8.1(typescript@5.6.3): resolution: {integrity: sha512-NAJ8WQHZL1WE1YmRoCrq/1hhG15Mvy/viWh6TkvFnBeEhNUiQUsA5GYyhU1ztnBIYW03nATO3vwhAEfO7Q0U5g==} - deprecated: No longer maintained, https://github.com/aspect-build/rules_ts is the recommended replacement hasBin: true peerDependencies: typescript: 5.6.3 diff --git a/tsconfig.json b/tsconfig.json index c2c25b7e5fcb..dbe34ec986e6 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -26,6 +26,7 @@ "@angular-devkit/schematics/testing": ["./packages/angular_devkit/schematics/testing/index"], "@angular-devkit/architect/*": ["./packages/angular_devkit/architect/*/index"], "@angular-devkit/build-webpack": ["./packages/angular_devkit/build_webpack"], + "@angular-devkit/build-angular": ["./packages/angular_devkit/build_angular"], "@angular-devkit/*": ["./packages/angular_devkit/*/src"], "@angular/ssr": ["./packages/angular/ssr"], "@angular/*": ["./packages/angular/*/src"], diff --git a/yarn.lock b/yarn.lock index 3657d2be5be0..29a3ab597972 100644 --- a/yarn.lock +++ b/yarn.lock @@ -351,6 +351,7 @@ __metadata: "@rollup/plugin-node-resolve": "npm:^13.0.5" "@stylistic/eslint-plugin": "npm:^2.8.0" "@types/babel__core": "npm:7.20.5" + "@types/babel__generator": "npm:^7.6.8" "@types/browser-sync": "npm:^2.27.0" "@types/express": "npm:^4.16.0" "@types/http-proxy": "npm:^1.17.4" @@ -4575,7 +4576,7 @@ __metadata: languageName: node linkType: hard -"@types/babel__generator@npm:*": +"@types/babel__generator@npm:*, @types/babel__generator@npm:^7.6.8": version: 7.6.8 resolution: "@types/babel__generator@npm:7.6.8" dependencies: From b2977c62c080c1141a32b51adcdbc19757233ea2 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Thu, 19 Dec 2024 14:25:15 +0000 Subject: [PATCH 3/3] Revert "test: update chunk file name to reflect new name" This reverts commit 3af88fef8b3255971cc20034d31b01012b7cacb3. No longer needed because the interop lays out the node modules directory like without the interop & `ts_project` migration; so the chunk name changed back to what it was before. Good news. --- .../src/builders/browser/tests/options/named-chunks_spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/angular_devkit/build_angular/src/builders/browser/tests/options/named-chunks_spec.ts b/packages/angular_devkit/build_angular/src/builders/browser/tests/options/named-chunks_spec.ts index e131303668f1..d2521c71cd98 100644 --- a/packages/angular_devkit/build_angular/src/builders/browser/tests/options/named-chunks_spec.ts +++ b/packages/angular_devkit/build_angular/src/builders/browser/tests/options/named-chunks_spec.ts @@ -11,7 +11,7 @@ import { BASE_OPTIONS, BROWSER_BUILDER_INFO, describeBuilder } from '../setup'; const MAIN_OUTPUT = 'dist/main.js'; const NAMED_LAZY_OUTPUT = 'dist/src_lazy-module_ts.js'; -const UNNAMED_LAZY_OUTPUT = 'dist/414.js'; +const UNNAMED_LAZY_OUTPUT = 'dist/358.js'; describeBuilder(buildWebpackBrowser, BROWSER_BUILDER_INFO, (harness) => { describe('Option: "namedChunks"', () => {