Encountering an issue when attempting to upgrade to Angular 9: Error arising in metadata creation for exported symbol

I am currently in the process of upgrading my Angular 8 application to Angular 9. When running the migration command, I encountered the following issue:

Undecorated classes with DI migration.
      As of Angular 9, it is no longer supported to use Angular DI on a class that does not have an Angular decorator.
      Learn more about this at: https://v9.angular.io/guide/migration-undecorated-classes
    
        This migration utilizes the Angular compiler internally, which means projects that fail to build after the update cannot run the migration successfully. Please ensure there are no AOT compilation errors and try running the migration again. The project that failed is: libs/core/tsconfig.lib.json
    
        Error: ~/core-routing.module.ts:138:1: An error occurred in the metadata generated for the exported symbol 'CoreRoutingModule':
         ~/core/src/lib/core-routing.module.ts:25:23: There is an error in the collected metadata that will be reported at runtime: Lambda not supported.
          {"__symbolic":"error","message":"Lambda not supported","line":24,"character":22}
    
        Not all undecorated classes using dependency injection could be migrated. Some project targets were unable to be analyzed due to TypeScript program failures.
    
        Rerun the migration with: "ng update @angular/core --migrate-only migration-v9-undecorated-classes-with-di"
    
      Migration complete.

Nx workspace : 8.12.0

Angular : 8

Answer №1

The strictMetadataEmit flag is specifically designed for libraries and should not include any lazy loaded modules. This setting is not intended for use in applications.

"strictMetadataEmit": true,

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Angular: A Guide to Displaying HTML Content from a TypeScript File

I implemented jQuery dataTable to showcase data on a list view. In my attempt to populate data into the dataTable, I used the following approach. Within users.component.ts: getUsers() { this.UserService.getUsersList() .subscribe( succ ...

Establish a global variable within a TypeScript file

I am currently facing an issue where I need to add an event to the browser inside the CheckSocialMedia function. However, it keeps saying that it could not find the name. So, my question is how do I make the 'browser' variable global in the .ts ...

Is it possible to specify the data type of form control values when using the Angular Reactive form builder?

Is it possible to use typed reactive forms with Angular form builder? I want to set the TValue on the form control to ensure we have the correct type. For example: public myForm= this.fb.group({ name: ['', [Validators.required, Validators.max ...

Injecting configurable middleware dependencies in Nest.js allows for dynamic customization of middleware

While many tutorials demonstrate how to inject providers into dynamic modules, most of them only focus on services and not middleware. The challenge arises when attempting to create reusable middleware that also requires injected providers. For instance, ...

Angular 9: Implementing a synchronous *ngFor loop within the HTML page

After receiving a list of subjects from the server, exercises are taken on each subject using the subject.id (from the server) and stored all together in the subEx variable. Classes are listed at the bottom. subjects:Subject[] temp:Exercise[] = [] s ...

"Troubleshooting: Issue with component not refreshing in app.component.html

I've been working on setting up the layout of my app in the app.component.html file. One thing I did was create a menu component with its own selector. Here is how my code currently looks: <app-menu></app-menu> <router-outlet>< ...

Issues with the functionality of a straightforward Angular 5 form that includes an Action

I'm facing an issue with the code provided below in my Angular HTML file. Surprisingly, it works perfectly fine when used individually in an HTML file. I can't seem to figure out what I'm doing wrong as this is just a simple form. <form ...

Incorporating Precision to Decimal Numbers in TypeScript Angular

Having some trouble with this issue and I've tried various solutions without success. This problem is occurring within an Angular project. The requirement is to always display a percentage number with two decimal places, even if the user inputs a who ...

The Angular application runs smoothly on my computer, but I encounter an error saying "ERROR [node 6/6] RUN npm run build --prod" after I create a Docker image

My DockerFile includes the following commands, along with a .dockerignore file excluding (node_modules; .gitignore). #stage 1 FROM node:alpine as node WORKDIR /app COPY . . RUN npm install #RUN npm install -g @angular/<a href="/cdn-cgi/l/email-protecti ...

Necessary CSS selector input equivalent in Reactive Forms

Is there a similar CSS method like input:required {CSS} to style all the reactive form fields in Angular that are set as required using Validators.required in their formControl? Or is there another approach to achieve this with CSS? ...

The GIPHY API object returns no results

Utilizing Angular 2 to fetch data from the GIPHY API. export class ListaGifsComponent { gifs : Object[] = []; urlBase = "http://api.giphy.com/v1/gifs/search?q="; termoPesquisado = "ryan+gosling"; key = "O8RhkTXfiSPmSCHosPAnhO70pdnHUiWn"; ...

Matching TypeScript against the resulting type of a string literal template

My type declaration looks like this: type To_String<N extends number> = `${N}` I have created a Type that maps the resulting string number as follows: type Remap<Number> = Number extends '0' ? 'is zero' : Number ...

Transforming raw data into an object in Angular: A step-by-step guide

Does anyone have tips on converting this raw data from a websocket message into an object for use in an Angular and Ionic project? var data = message.payload; console.log(data); After logging 'data' to the console, here is the result: ...

Tips for simulating a decorator function applied to a method used in the system under test using JEST

I currently have a typescript class setup like this: export class SystemUnderTest { @LogThisAction('something was done') public doSomething() {} } It is clear that reflection is being used to execute a specific decoration function: exp ...

How can I retrieve GET parameters in Angular 2?

When accessing myproject.dev/people?filter%5Bindustry%5D=finance&filter%5BstartWith%5D=a, Angular2 redirects the url to myproject.dev/people Below is the RouteConfig: @RouteConfig([ { path: '/people', name: config.route. ...

The p-dialog lacks the proper styling and does not show or hide correctly

I am working on adding a feature where dragging and dropping an event in a calendar triggers a dialog box that requires the user to confirm if they want to postpone the event. However, I ran into an issue where the styling of my p-dialog is not defaulting ...

IDE flags an error with TypeScript type declarations

Here is how my type definition looks: export type AuthType = boolean | { roles: string[]; assistant?: string[] } | (() => void); Now, I need to check the type of the auth variable and assign a value or execute a function in this line of code: req.all ...

After successfully installing @angular/localize, running npm update or npm install could result in a dependency error

I am looking to implement @angular/localize in my Angular application. Currently, I have a newly created NestJS backend integrated with an Angular frontend within an Nx monorepo. Upon attempting to install the package using npm install @angular/localize, ...

What could be causing the issue of CSS Styles not being applied to an Angular 2 component with Vaadin elements?

Currently, I am immersed in the tutorial on Vaadin elements using Angular 2 that I stumbled upon here In section 5.3, Styles are applied to the app.component.ts as shown below import { Component } from [email protected]/core'; @Component({ select ...

Error occurred due to changed expression after validation

I am facing an issue in my Angular app while implementing checkboxes with ngModel. When I try to implement it, I encounter the following error message. Can someone please help me resolve this problem? Error core.js:5873 ERROR Error: ExpressionChangedAfter ...