Setup Inertia JS with Typescript in vue 3 with vite

[JaavierR]

Hi everyone,

I have been wanting to configure typescript with inertia for a while now, and now with the release of version 1.0.0 I wanted to test it but I keep running into the same problems.

The application runs and works without problems, but TS gives me errors that the $page property does not exist on type... for example, maybe it is more with the configuration of TS than inertia, but I tried to look for examples of how to configure everything with vite and I could not find anything, and the documentation does not mention a recommended configuration for TS.

If someone could give me some guidance here, or refer me to an example project, or a post in a blog I would greatly appreciate it.

Also thanks to the team for this new release and their amazing work.

[francoism90]

@JaavierR You need to create your own types ineria.d.ts:

import type { Page } from '@inertiajs/core'

declare module '@inertiajs/core' {
  interface PageProps {
    auth: {
      logout: {
        route: string
      }
    }
    flash: {
      message: string
    }
  }
}

declare module '@inertiajs/vue3' {
  export declare function usePage<T>(): Page<T>
}