Path alias won't resolve in prerender

[nyomansunima]

Reproduction

I want to prerender all of my works pages to load the slugs(paths). It's keep failing because not be able to load the file that i import using path alias from prerender functions.

If i change the import using actual path it's works. However all my code related with thoose paths

My files

vite.config.ts

import { reactRouter } from "@react-router/dev/vite"
import tailwindcss from "@tailwindcss/vite"
import { defineConfig } from "vite"
import tsconfigPaths from "vite-tsconfig-paths"

export default defineConfig({
  plugins: [tsconfigPaths(), tailwindcss(), reactRouter()],
})

react-router.config.ts

import { getWorkPaths } from "@features/works" // ---> Error by this
import type { Config } from "@react-router/dev/config"

export default {
  appDirectory: "src",
  ssr: true,
  prerender: async ({ getStaticPaths }) => {
    const staticPaths = getStaticPaths()
    const workPaths = await getWorkPaths()

    return [...staticPaths, ...workPaths]
  },
} satisfies Config

tsconfig.json

{
  "include": [
    "**/*",
    "**/.server/**/*",
    "**/.client/**/*",
    ".react-router/types/**/*"
  ],
  "compilerOptions": {
    "lib": ["DOM", "DOM.Iterable", "ES2022"],
    "types": ["node", "vite/client"],
    "target": "ES2022",
    "module": "ES2022",
    "moduleResolution": "bundler",
    "jsx": "react-jsx",
    "rootDirs": [".", "./.react-router/types"],
    "baseUrl": ".",
    "paths": {
      "@shared/*": ["./src/shared/*"],
      "@features/*": ["./src/features/*"],
      "@app/*": ["./src/app/*"],
      "~/*": ["./src/*"],
      "@/*": ["./*"]
    },
    "esModuleInterop": true,
    "verbatimModuleSyntax": true,
    "noEmit": true,
    "allowJs": true,
    "noImplicitAny": false,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "strict": true
  }
}

Results

/Users/nyomansunima/Projects/personal/official-site/node_modules/@react-router/dev/dist/vite.js:581
    throw new Error(initialConfigResult.error);
          ^

Error: Error loading /Users/nyomansunima/Projects/personal/official-site/react-router.config.ts: Error: Cannot find package '@features/works' imported from '/Users/nyomansunima/Projects/personal/official-site/react-router.config.ts'
    at createConfigLoader (/Users/nyomansunima/Projects/personal/official-site/node_modules/@react-router/dev/dist/vite.js:581:11)
    at createContext2 (/Users/nyomansunima/Projects/personal/official-site/node_modules/@react-router/dev/dist/vite.js:798:24)
    at watch (/Users/nyomansunima/Projects/personal/official-site/node_modules/@react-router/dev/dist/vite.js:1196:15)

Code

https://github.com/nyomansunima/official-site/tree/343-integrate-with-mdx-for-all-works

System Info

System:
    OS: macOS 15.5
    CPU: (8) arm64 Apple M1
    Memory: 309.97 MB / 8.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.17.1 - /opt/homebrew/bin/node
    npm: 10.9.2 - /opt/homebrew/bin/npm
    bun: 1.2.18 - /opt/homebrew/bin/bun
  Browsers:
    Brave Browser: 138.1.80.122
    Safari: 18.5
  npmPackages:
    @react-router/dev: ^7.6.3 => 7.6.3
    @react-router/fs-routes: ^7.6.3 => 7.6.3
    @react-router/node: ^7.6.3 => 7.6.3
    @react-router/serve: ^7.7.0 => 7.7.0
    react-router: ^7.6.3 => 7.6.3
    vite: ^7.0.2 => 7.0.3

Used Package Manager

npm

Expected Behavior

Would be able to load those function using paths alias

Actual Behavior

It's won't load the file from path alias

[nyomansunima]

Please help 🥺

[pawelblaszczyk5]

These aliases are magical a bit, tsconfig#paths isn't for creating aliases, it's for informing TS what your other tooling aliases. If you want something that works conveniently across every tool, without any headache - use subpath imports

[nyomansunima]

Doesn't vite-tsconfig-paths help resolve the aliases from the paths themselves?.

[nyomansunima]

This mean that the paths are not working in config(react-router.config.ts)

[github-actions]

👋 @nyomansunima, we use the issue tracker exclusively for bug reports and feature requests. However, this issue appears to be a support request.
For usage questions, please use Stack Overflow or Discord where there are a lot more people ready to help you out, or post a new question in the Discussions tab of this repository.
Please feel free to clarify your issue if you think it was closed prematurely.