Within my Vue 3 app component, I need to interact with custom properties on the Window object, as shown below:
window.ZohoHCAsapSettings = { //<-- ERROR HERE
ticketsSettings: {
preFillFields: {
email: {
defaultValue: user.value?.email,
},
},
},
};
However, when trying to access ZohoHCAsapSettings, I encounter a TypeScript error:
Property 'ZohoHCAsapSettings' does not exist on type 'Window & typeof globalThis'. ts(2339)
To address this issue, I attempted to extend the window object like so:
interface customWindow extends Window {
ZohoHCAsapSettings?: unknown;
}
declare const window: customWindow; //<-- ERROR HERE
window.ZohoHCAsapSettings = {
ticketsSettings: {
preFillFields: {
email: {
defaultValue: user.value?.email,
},
},
},
};
This resolves the error related to ZohoHCAsapSettings, but now I encounter a new error on the declare keyword:
Modifiers cannot appear here. ts(1184)
As a newcomer to TypeScript, I'm unsure about the cause of this issue.
For context, I am using Visual Studio Code as my IDE.
Any insights or solutions would be greatly appreciated.