TanStackT
TanStack10mo ago
6 replies
worthy-azure

Path alias not working

Not sure if this is the right place for this but I'm having an issue with trying to use a Typescript path alias.

Error: Cannot find module '@/lib/theming' imported from 'D:/Git/tanstack-test/apps/www/src/routes/__root.tsx'


I've set up the path alias, the editor is picking up the right path (see hover-over in screenshot) and I've got the vite plugin for the tsconfig paths.

app.config.ts


// app.config.ts
import tailwindcss from '@tailwindcss/vite'
import { defineConfig } from '@tanstack/react-start/config'
import tsConfigPaths from 'vite-tsconfig-paths'


export default defineConfig({
    tsr: {
        appDirectory: './src',
    },

    vite: {
        plugins: [
            tsConfigPaths({
                projects: ['./tsconfig.json'],
            }),
            tailwindcss(),
        ],
    },

    react: {
      babel: {
        plugins: [
          [
            "babel-plugin-react-compiler",
            {
              target: "19",
            },
          ],
        ],
      },
    },
})


Anyone got any ideas? If I use a relative path to the lib file then it's fine. I'm definitely not new to TS but this one has me a little stumped.
image.png
Was this page helpful?