Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

beartown's avatar

How to configure TypeScript for Inertia?

I struggle to make TypeScript work correctly with Inertia. I want to use the Ziggy library for routing, but nothing from the docs is working correctly.

I added @routes in my layout blade tempate and it makes the route() function available globally.

I added it in my custom .d.ts file:

import { route as routeFn } from "../../vendor/tightenco/ziggy";

declare global {
    var route: typeof routeFn;
}

I wanted to declare alias ziggy-js, but gave up after an hour or so trying to make it work with VS Code. Nevermind.

It looks like I need to create the tsconfig.json file, because otherwise my global type definition isn't working when the file is closed (yeah).

So I did:

{
  "compilerOptions": {
    "target": "ES2020",
    "useDefineForClassFields": true,
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "module": "ESNext",
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "noEmit": true,
    "jsx": "react-jsx",

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true
  },
  "include": ["resources/js"]
}

Now, the problem is that when I use "include": ["resources/js"], I can't import any library anymore. Even import React from "react" is throwing an error:

Could not find a declaration file for module 'react'. '/Users/me/www/inertia-app/node_modules/react/index.js' implicitly has an 'any' type.

How do I make it work?

0 likes
0 replies

Please or to participate in this conversation.