I am encountering an issue while trying to add typescript to a pinia store. Any suggestions on how to resolve this problem would be appreciated. The project currently utilizes pinia:^2.0.16 and Vue:3.2.37
The error message is as follows:
Type '{}' is missing the following properties from type 'Order': id, user_id, total, user, products
import type { ShoppingCart } from '@/Models/ShoppingCart'
import type { Product } from '@/Models/Product'
const initialState : ShoppingCart = {
products: [],
cart: [],
order: {}, // <- here is the typescript error
}
export const useShoppingCart = defineStore('shoppingcart', {
persist: true,
state: () => (initialState),
actions: {
addToCart(product: Product) {
....
},
removeFromCart(){
.....
},
...
...
}
Models/ShoppingCart.ts
import type { Order } from './Order'
import type { Product } from './Product'
export interface ShoppingCart {
products: Product[]
cart: Product[]
order: Order
}
Models/Order.ts
import type { User } from './User'
import type { Product } from './Product'
export interface Order {
id: number
user_id: number
total: number
user: User
products: Product[]
}
Models/Product.ts
import type { Category } from '@/Models/Category'
export interface Product {
id: number
name: string
slug: string
description: string
price: number
categories: Category[]
quantity: number
}
Models/Category.ts
import type { Product } from '@/Models/Product'
export interface Category {
id: number
name: string
slug: string
products?: Product[]
}
Models/User.ts
import type { Order } from './Order'
export interface User {
id: number
name: string
email: string
orders: Order[]
}
An error is being triggered in the order property of the InitialState:
const initialState : ShoppingCart = {
products: [],
cart: [],
order: {}, // <- here is the typescript error
}
If anyone has insights on resolving this error, I would greatly appreciate it. Thank you.