I have a simple Purchase class:
export class Purchase {
customer!: Customer;
shippingAddress!: Address;
billingAddress!: Address;
order!: Order;
orderItems!: OrderItem[];
}
I have a checkout component which does the following:
// populate purchase - customer
purchase.customer = this.checkoutFormGroup.controls['customer'].value;
// populate purchase - shipping address
purchase.shippingAddress = this.checkoutFormGroup.controls['shippingAddress'].value;
const shippingState: State = JSON.parse(JSON.stringify(purchase.shippingAddress.state));
const shippingCountry: Country = JSON.parse(JSON.stringify(purchase.shippingAddress.country));
purchase.shippingAddress.state = shippingState.name;
purchase.shippingAddress.country = shippingCountry.name;
In this the below lines give the error Cannot find name 'JSON'.ts(2304):
const shippingState: State = JSON.parse(JSON.stringify(purchase.shippingAddress.state));
const shippingCountry: Country = JSON.parse(JSON.stringify(purchase.shippingAddress.country));
I suspect the problem is that I've the following config in tsconfig.json:
"compilerOptions": {
...
"target": "es2017",
"module": "es2020",
"lib": [
"es2018",
"dom"
]
}
I tried changing es2018 to es5 but that didn't resolve my issue. Either way, surely there should be a way of doing this sort of thing with es2018. Can anybody tell me how to resolve this?
This helped me fix my issue. The version was 4.5.something. It's now 4.2.2 and JSON is now found.