unwilling-turquoise

Cant enable autoCodeSplitting

Hello! I just found the autoCodeSplitting function, i tried enabling it and im getting [router-code-splitter-plugin] Unexpected splitNode type ☝️: VariableDeclarator I tried updating to:

 "@tanstack/react-router": "^1.76.3",
    "@tanstack/router-generator": "1.74.2",
    "@tanstack/router-plugin": "^1.76.0",

 "@tanstack/react-router": "^1.76.3",
    "@tanstack/router-generator": "1.74.2",
    "@tanstack/router-plugin": "^1.76.0",

and my routeTree.gen.ts was slightly changed, but its still not working, any suggestion?

5 Replies

optimistic-gold•11mo ago

can you please provide a minimal complete example that fails?

unwilling-turquoiseOP•11mo ago

Seems to be happening if you use an arrow function declared in a const instead of a regular funcition or an arrow function inline. Steps to reproduce: 1. Go to https://tanstack.com/router/latest/docs/framework/react/examples/quickstart-file-based 2. Modify vite.config.js to add autoCodeSplitting: true 3. Go to about.tsx 4. Replace the AboutComponent for:

const AboutComponent = () => {
  return <div>hello</div>;
};

const AboutComponent = () => {
  return <div>hello</div>;
};

5. Run npm run build and you get

error during build:
[router-code-splitter-plugin] Unexpected splitNode type ☝️: VariableDeclarator
file: /home/projects/gqairqnavq.github/src/routes/about.tsx?tsr-split
    at eval (file:///home/projects/gqairqnavq.github/node_modules/@tanstack/router-plugin/dist/esm/core/code-splitter/compilers.js:316:21)
    at enter (file:///home/projects/gqairqnavq.github/node_modules/@tanstack/router-plugin/dist/esm/core/code-splitter/compilers.js:240:24)
    at NodePath._call (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/path/context.js:49:20)
    at NodePath.call (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/path/context.js:39:18)
    at NodePath.visit (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/path/context.js:88:31)
    at TraversalContext.visitQueue (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/context.js:90:16)
    at TraversalContext.visitSingle (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/context.js:66:19)
    at TraversalContext.visit (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/context.js:113:19)
    at traverseNode (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/traverse-node.js:22:17)

error during build:
[router-code-splitter-plugin] Unexpected splitNode type ☝️: VariableDeclarator
file: /home/projects/gqairqnavq.github/src/routes/about.tsx?tsr-split
    at eval (file:///home/projects/gqairqnavq.github/node_modules/@tanstack/router-plugin/dist/esm/core/code-splitter/compilers.js:316:21)
    at enter (file:///home/projects/gqairqnavq.github/node_modules/@tanstack/router-plugin/dist/esm/core/code-splitter/compilers.js:240:24)
    at NodePath._call (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/path/context.js:49:20)
    at NodePath.call (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/path/context.js:39:18)
    at NodePath.visit (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/path/context.js:88:31)
    at TraversalContext.visitQueue (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/context.js:90:16)
    at TraversalContext.visitSingle (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/context.js:66:19)
    at TraversalContext.visit (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/context.js:113:19)
    at traverseNode (/home/projects/gqairqnavq.github/node_modules/@babel/traverse/lib/traverse-node.js:22:17)

TanStack | High Quality Open-Source Software for Web Developers

Headless, type-safe, powerful utilities for complex workflows like Data Management, Data Visualization, Charts, Tables, and UI Components.

optimistic-gold•11mo ago

good catch

optimistic-gold•11mo ago

i fixed this in https://github.com/TanStack/router/releases/tag/v1.76.4

GitHub

Release v1.76.4 · TanStack/router

Version 1.76.4 - 10/26/24, 11:05 PM Changes Fix router-plugin: correctly handle VariableDeclarator when splitting (#2650) (27a8821) by Manuel Schiller Chore examples: update Convex React Query t...

unwilling-turquoiseOP•11mo ago

Thanks!

Gaming

Programming

Cant enable autoCodeSplitting

Did you find this page helpful?