Mi aplicación Angular se sirve a través de Node 16.13.0. Después de actualizar a Angular 13, recibo el siguiente error:
La compilación JIT falló para el archivo inyectable [class PlatformLocation]: ///Users/btaylor/work/angular-apps/dz-outages-ui/node_modules/@angular/core/fesm2015/core.mjs:4058 lanzar nuevo error (mensaje) ; ^
Error: la 'PlatformLocation' inyectable debe compilarse con el compilador JIT, pero '@angular/compiler' no está disponible.
El inyectable es parte de una biblioteca que ha sido compilada parcialmente. Sin embargo, Angular Linker no ha procesado la biblioteca de modo que la compilación JIT se use como alternativa.
Idealmente, la biblioteca se procesa utilizando Angular Linker para compilar completamente AOT. Alternativamente, el compilador JIT debe cargarse arrancando usando '@angular/platform-browser-dynamic' o '@angular/platform-server', o proporcionar manualmente al compilador 'importar "@angular/compiler";' antes del arranque. en getCompilerFacade (archivo:///Users/btaylor/work/angular-apps/dz-outages-ui/node_modules/@angular/core/fesm2015/core.mjs:4058:15) en Module.ɵɵngDeclareFactory (archivo:// /Users/btaylor/work/angular-apps/dz-outages-ui/node_modules/@angular/core/fesm2015/core.mjs:32999:22) en archivo:///Users/btaylor/work/angular-apps/ dz-outages-ui/node_modules/@angular/common/fesm2015/common.mjs:90:28 en ModuleJob.run (node:internal/modules/esm/module_job:185:25) en async Promise.all (índice 0) en async ESMLoader.import (node:internal/modules/esm/loader:281:24) en async loadESM (node:internal/process/esm_loader:88:5) en async handleMainPromise (node:internal/modules/run_main:65: 12)
He probado numerosas soluciones, como: Error de compilación de Angular JIT: '@angular/compiler' no cargado
Actualmente, tengo "type": "module" en mi paquete.json
He actualizado mi comando de postinstalación a: ngcc --properties es2020 browser module main --first-only --create-ivy-entry-points
También agregué import '@angular/compiler'; a mi archivo main.ts
El proyecto se compilará, pero no se ejecutará a través de Node.
Creo que he encontrado la solución (suponiendo que esté usando broma como corredor de prueba). En el archivo test-setup.ts , mi proyecto todavía usaba la importación obsoleta para jest-preset-angular. En lugar de import 'jest-preset-angular'; intenta usar import 'jest-preset-angular/setup-jest'; .
Esto solucionó el problema para mí.
Parece que angular 13 convirtió babel-loader un requisito obligatorio para vincular paquetes nativos de Ivy. https://github.com/angular/angular/issues/44026#issuecomment-974137408 - y el problema ocurre porque las bibliotecas principales de Angular ya están compiladas con el formato del paquete Ivy.
Todavía no he realizado el cambio en mis propios proyectos, pero el procesamiento de archivos .mjs con babel y un enlazador especial debería ser suficiente.
import { dynamicImport } from 'tsimportlib'; /** * Webpack configuration * * See: http://webpack.github.io/docs/configuration.html#cli */ export default async (options: IWebpackOptions) => { const linkerPlugin = await dynamicImport('@angular/compiler-cli/linker/babel', module); const config: any = { module: { rules: [{ test: /\.mjs$/, loader: 'babel-loader', options: { compact: false, plugins: [linkerPlugin.default], }, resolve: { fullySpecified: false } } } } }Haré más actualizaciones en esta publicación una vez que pueda probarlo yo mismo.