Repository navigation
Prerender never exits with custom alias injected by Vite plugin #7516
Copy link
Copy link
Open
Description
Activity
- changed the title
[-]Prerendering stay stuck when alias declared[/-][+]Prerender never exits with custom alias injected by Vite plugin[/+]on May 31, 2026 Not sure it will help, but here is the content on both side of the alias
Entry point of
@intlayer/config/src/built(content A) (server side)/** * @intlayer/config/built is a package that only returns the configuration file as a JSON object. * Using an external package allow to alias it in the bundle configuration (such as webpack). */ import type { IntlayerConfig } from '@intlayer/types/config'; import { getConfiguration } from './configFile/getConfiguration'; const configuration: IntlayerConfig = getConfiguration(); const parsedJSONConfig = JSON.parse(JSON.stringify(configuration)); export const internationalization = parsedJSONConfig.internationalization; export const dictionary = parsedJSONConfig.dictionary; export const routing = parsedJSONConfig.routing; export const content = parsedJSONConfig.content; export const system = parsedJSONConfig.system; export const editor = parsedJSONConfig.editor; export const log = parsedJSONConfig.log; export const ai = parsedJSONConfig.ai; export const build = parsedJSONConfig.build; export const compiler = parsedJSONConfig.compiler; export const schemas = parsedJSONConfig.schemas; export const plugins = parsedJSONConfig.plugins;
Aliased content at
.intlayer/config/configuration.mjs(content B) (client side)const internationalization = { "locales": [ "en", "fr", "es" ], "requiredLocales": [ "en", "fr", "es" ], "strictMode": "inclusive", "defaultLocale": "en" }; const routing = { "mode": "prefix-no-default", "storage": { "cookies": [ { "name": "INTLAYER_LOCALE", "attributes": {} } ], "headers": [ { "name": "x-intlayer-locale" } ] }, "basePath": "" }; const editor = { "editorURL": "http://localhost:8000", "cmsURL": "https://app.intlayer.org", "backendURL": "https://back.intlayer.org", "port": 8000, "enabled": false, "dictionaryPriorityStrategy": "local_first", "liveSync": false, "liveSyncPort": 4000, "liveSyncURL": "http://localhost:4000" }; const log = { "mode": "verbose", "prefix": "\u001b[38;5;239m[intlayer] \u001b[0m" }; const system = { "baseDir": "/Users/xxx/path/to", "moduleAugmentationDir": "/Users/xxx/path/to/.intlayer/types", "unmergedDictionariesDir": "/Users/xxx/path/to/.intlayer/unmerged_dictionary", "remoteDictionariesDir": "/Users/xxx/path/to/.intlayer/remote_dictionary", "dictionariesDir": "/Users/xxx/path/to/.intlayer/dictionary", "dynamicDictionariesDir": "/Users/xxx/path/to/.intlayer/dynamic_dictionary", "fetchDictionariesDir": "/Users/xxx/path/to/.intlayer/fetch_dictionary", "typesDir": "/Users/xxx/path/to/.intlayer/types", "mainDir": "/Users/xxx/path/to/.intlayer/main", "configDir": "/Users/xxx/path/to/.intlayer/config", "cacheDir": "/Users/xxx/path/to/.intlayer/cache", "tempDir": "/Users/xxx/path/to/.intlayer/tmp" }; const content = { "fileExtensions": [ ".content.ts", ".content.js", ".content.cjs", ".content.mjs", ".content.json", ".content.json5", ".content.jsonc", ".content.tsx", ".content.jsx", ".content.md", ".content.mdx", ".content.yaml", ".content.yml" ], "contentDir": [ "/Users/xxx/path/to" ], "codeDir": [ "/Users/xxx/path/to" ], "excludedPath": [ "**/node_modules/**", "**/dist/**", "**/build/**", "**/.intlayer/**", "**/.next/**", "**/.nuxt/**", "**/.expo/**", "**/.vercel/**", "**/.turbo/**", "**/.tanstack/**" ], "watch": true }; const ai = {}; const dictionary = { "fill": true, "contentAutoTransformation": false, "location": "local", "importMode": "static" }; const build = { "mode": "auto", "minify": false, "purge": false, "traversePattern": [ "**/*.{tsx,ts,js,mjs,cjs,jsx,vue,svelte,astro}", "!**/node_modules/**", "!**/dist/**", "!**/build/**", "!**/.intlayer/**", "!**/.next/**", "!**/.nuxt/**", "!**/.expo/**", "!**/.vercel/**", "!**/.turbo/**", "!**/.tanstack/**", "!**/*.config.*", "!**/*.test.*", "!**/*.spec.*", "!**/*.stories.*", "!**/*.d.ts", "!**/*.d.ts.map", "!**/*.map" ], "outputFormat": [ "esm", "cjs" ], "cache": true, "checkTypes": false }; const compiler = { "enabled": true, "dictionaryKeyPrefix": "", "noMetadata": false, "saveComponents": false }; export { internationalization, routing, editor, log, system, content, ai, dictionary, build, compiler };
- ❌ Placing content B on both side pass the build but block at prerendering
- ✅ Placing content A on both side pass the build and prerendering (but crash on client side
Cannot find package 'esbuild' from '/Users/aymericpineau/Documents/intlayer_/apps/website-react-router/.output/server/_ssr/getDictionary-5gYNIxUc.mjs)
Update: It seems related to
@tanstack/react-queryThis is blocking prerender:
------ packages/@intlayer/design-system/src/api/useAuth/useSession.ts ------'use client'; import type { SessionAPI } from '@intlayer/backend'; import { useQuery } from '@tanstack/react-query'; export const useSession = () => { // Keep TanStack generics internal so they don't leak into the d.ts const { data, isFetched, refetch } = useQuery({ queryKey: ['session'], queryFn: async () => { return null; }, enabled: false, }); return { session: null, fetchSession: async () => null, revalidateSession: async () => null, setSession: async () => {}, }; };
But this one pass the pre-rendering
------ packages/@intlayer/design-system/src/api/useAuth/useSession.ts ------'use client'; import type { SessionAPI } from '@intlayer/backend'; import { useQuery } from '@tanstack/react-query'; export const useSession = () => { // Keep TanStack generics internal so they don't leak into the d.ts const { data, isFetched, refetch } = typeof window !== 'undefined' ? useQuery({ queryKey: ['session'], queryFn: async () => { return null; }, enabled: false, }) : {}; return { session: null, fetchSession: async () => null, revalidateSession: async () => null, setSession: async () => {}, }; };
Simplifying again,
This code block prerendering
------ apps/website-tanstack/src/components/Navbar/index.tsx ------import { useQuery } from '@tanstack/react-query'; import type { FC } from 'react'; export const Navbar: FC = () => { useQuery({ queryKey: ['session'], queryFn: async () => { return null; }, enabled: false, }); return <></>; };
But this one is passing
import { useQuery } from '@tanstack/react-query'; import type { FC } from 'react'; export const Navbar: FC = () => { // useQuery({ // queryKey: ['session'], // queryFn: async () => { // return null; // }, // enabled: false, // }); return <></>; };
But again, removing aliases provided by intlayer also resolve it
Metadata
Metadata
Assignees
Labels
No labels
Which project does this relate to?
Router
Describe the bug
Similar to #6425
I'm encountering a similar problem when enabling pre-rendering.
Bun (
1.3.14)Packages:
"@tanstack/react-query": "5.100.14","@tanstack/react-router": "1.170.10","@tanstack/react-router-devtools": "1.167.0","@tanstack/react-router-ssr-query": "1.167.1","@tanstack/react-start": "1.168.18","vite": "8.0.14"OS: Mac
Checked config:
<></>still causes it to hang too[prerender] - /pageName x, then stays stuck once all pages have been pre-rendered.I did a deeper analysis and found that the issue is caused by an alias. Intlayer injects aliases for build optimization: https://github.com/aymericzip/intlayer/blob/main/packages/vite-intlayer/src/intlayerPlugin.ts
When removing the problematic alias (
'@intlayer/config/built': '/absolute/path/to/.intlayer/config/configuration.mjs'), pre-rendering completes successfully. However, the client then crashes because of anfsimport (which is the reason the alias is used in the first place).Trick to reproduce, commenting out the intlayer plugin + isolation of aliases in another plugin reproduce the issue:
What confuses me is that:
In my case, that alias lead to that blockage, but I'm not sure the alias is the reason. it seems to be an import resolution related issue.
At first, I thought it might be related to having both named and default exports, but removing all default exports did not fix the issue.
For example:
I'll continue experimenting and provide more details if I find any important point that can help debbuging.
App to reproduce: https://github.com/aymericzip/intlayer/blob/main/apps/website-tanstack
(Repo context is massive, sorry for that, but I have no idea how to reproduce properly)
1- Clone: https://github.com/aymericzip/intlayer
2- install dep
3- build packages: bun run build
4- cd apps/website-tanstack
5- enable prerendering in
vite.config.ts6- rename
.env.templateto.env7- bun run build
Complete minimal reproducer
https://github.com/aymericzip/intlayer/blob/main/