I am using VueJs with typescript & vite. I have an icons file contents are following:
export const ICONS = {
CLOCK: 'kbtmbyzy',
CALENDAR: 'gphxrzct',
}
In my main.ts file. I have attached this as a global property, after importing it from the file.
app.config.globalProperties.ICONS = ICONS;
I have component:
<animated-icon :name="ICONS.CLOCK" />
Notice ICONS is highlighted and shows the follow error:
Property 'ICONS' does not exist on type '{ $: ComponentInternalInstance; $data: {}; $props: Partial<{}> & Omit<Readonly<ExtractPropTypes<{}>> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): WatchStopHandle; } & ... 4 more ... & Co...'.ts(2339)
I am using vue3 composition api. It gives the error when I use composition api with setup in script tag:
<script setup lang="ts"></script>
However it doesn't gives the error when used export default:
export default {
setup() {}
}
</script>
I want to use first method with setup in the script tag.