Cannot assign to read only property 'x' of object '[object Object]'

Issue

After upgrading my project to Angular 12/TypeScript 4.3.5, I am getting the error above. Here is my code:

for (const metric of metrics) {
    if (!metric.focalThemeSubArea) {
        metric.focalThemeSubArea = metric.focalTheme;
    }
}

My Metric class is defined as follows:

export class ScaMetricGraphType {
    public focalTheme: string;
    public focalThemeSubArea: string;
    public isActive: boolean;
    public name: string;
}

I don't see anything that's read-only about focalThemeSubArea. While it's true that I declared metric as const in the loop, that shouldn't mean that its members become read-only. Unless something changed about TypeScript that I'm unaware of.

Solution

Sorry, community. This was an issue with my development environment. I was upgrading from 7 to 12, and trying to keep as much consistent as possible in my angular.json and tsconfig.json.

I'm still not sure what exactly caused this, so this really isn't an answer. But I did create a new Angular 12 app with the default settings, and ran my code there, where it worked perfectly.

Thanks for your help with this.

Answered By - FunkMonkey33