Vue 3 with TypeScript cheat sheet

Prerequisites#

For this, you'll need a Vue 3 + TypeScript (+ Tailwind CSS) project.

You can set up one following the instructions here:
Build a Vue 3 + TypeScript dev environment with Vite 

Basic types, Records#

• If you want a type meaning "any value", you probably want unknown instead.
• If you want a type meaning "any object", you probably want Record<string, unknown> instead.
• If you want a type meaning "empty object", you probably want Record<string, never> instead.

Adding properties to the window object#

Add a src/index.d.ts file with this content:

export {}

declare global {
  interface Window {
    someVariable: string
    otherThing: number
    // any other variables you need here...
  }
}

[x: string]: boolean | SomeTree [1]: https://vuejs.org/guide/essentials/template-refs.html#accessing-the-refs "Template Refs - Accessing the Refs" [2]: https://vuejs.org/api/sfc-script-setup.html#defineexpose "