@tanstack/create 0.61.2 → 0.61.4

package/src/frameworks/react/project/base/package.json

@@ -2,6 +2,9 @@
   "name": "",
   "private": true,
   "type": "module",
+  "imports": {
+    "#/*": "./src/*"
+  },
   "scripts": {
     "dev": "vite dev --port 3000",
     "build": "vite build",
@@ -16,8 +19,7 @@
     "@tanstack/react-start": "^1.132.0",
     "lucide-react": "^0.561.0",
     "react": "^19.2.0",
-    "react-dom": "^19.2.0",
-    "vite-tsconfig-paths": "^5.1.4"
+    "react-dom": "^19.2.0"
   },
   "devDependencies": {
     "@tanstack/devtools-vite": "^0.3.11",
@@ -29,6 +31,7 @@
     "jsdom": "^27.0.0",
     "typescript": "^5.7.2",
     "vite": "^7.1.7",
+    "vite-tsconfig-paths": "^5.1.4",
     "vitest": "^3.0.5"
   }
 }

package/src/frameworks/react/project/base/src/main.tsx.ejs

@@ -0,0 +1,24 @@
+<% if (!routerOnly) { ignoreFile() } %>
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import { RouterProvider, createRouter } from '@tanstack/react-router'
+import { routeTree } from './routeTree.gen'
+
+const router = createRouter({
+  routeTree,
+  defaultPreload: 'intent',
+  scrollRestoration: true,
+})
+
+declare module '@tanstack/react-router' {
+  interface Register {
+    router: typeof router
+  }
+}
+
+const rootElement = document.getElementById('app')!
+
+if (!rootElement.innerHTML) {
+  const root = ReactDOM.createRoot(rootElement)
+  root.render(<RouterProvider router={router} />)
+}

package/src/frameworks/react/project/base/src/routes/__root.tsx.ejs

@@ -1,3 +1,33 @@
+<% if (routerOnly) { %>
+import { Outlet, createRootRoute } from '@tanstack/react-router'
+import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'
+import { TanStackDevtools } from '@tanstack/react-devtools'
+
+import '../styles.css'
+
+export const Route = createRootRoute({
+  component: RootComponent,
+})
+
+function RootComponent() {
+  return (
+    <>
+      <Outlet />
+      <TanStackDevtools
+        config={{
+          position: 'bottom-right',
+        }}
+        plugins={[
+          {
+            name: 'TanStack Router',
+            render: <TanStackRouterDevtoolsPanel />,
+          },
+        ]}
+      />
+    </>
+  )
+}
+<% } else { %>
 <% let hasContext = addOnEnabled["apollo-client"] || addOnEnabled["tanstack-query"]; %>
 import {
   HeadContent, Scripts, <% if (hasContext) { %>createRootRouteWithContext<% } else { %>createRootRoute<% } %> } from '@tanstack/react-router'
@@ -8,7 +38,7 @@ import Header from '../components/Header'
 <% } %><% for(const integration of integrations.filter(i => i.type === 'layout' || i.type === 'provider' || i.type === 'devtools')) { %>
 import <%= integration.jsName %> from '<%= relativePath(integration.path, true) %>'
 <% } %><% if (addOnEnabled.paraglide) { %>
-import { getLocale } from '@/paraglide/runtime'
+import { getLocale } from '#/paraglide/runtime'
 <% } %>
 import appCss from '../styles.css?url'
 <% if (addOnEnabled["apollo-client"]) { %>
@@ -17,7 +47,7 @@ import type { ApolloClientIntegration } from "@apollo/client-integration-tanstac
 <% if (addOnEnabled["tanstack-query"]) { %>
 import type { QueryClient } from '@tanstack/react-query'
 <% if (addOnEnabled.tRPC) { %>
-import type { TRPCRouter } from '@/integrations/trpc/router'
+import type { TRPCRouter } from '#/integrations/trpc/router'
 import type { TRPCOptionsProxy } from '@trpc/tanstack-react-query'
 <% } %>
 <% } %>
@@ -93,3 +123,4 @@ function RootDocument({ children }: { children: React.ReactNode }) {
     </html>
   )
 }
+<% } %>

package/src/frameworks/react/project/base/tsconfig.json.ejs

@@ -5,6 +5,10 @@
     "target": "ES2022",
     "jsx": "react-jsx",
     "module": "ESNext",
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    },
     "lib": ["ES2022", "DOM", "DOM.Iterable"],
     "types": ["vite/client"],
 
@@ -21,10 +25,6 @@
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true,
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/*"]
-    }
+    "noUncheckedSideEffectImports": true
   }
 }

package/src/frameworks/react/project/base/vite.config.ts.ejs

@@ -1,33 +1,28 @@
 import { defineConfig } from 'vite'
 import { devtools } from '@tanstack/devtools-vite'
+import tsconfigPaths from 'vite-tsconfig-paths'
 <% if (addOnEnabled.paraglide) { -%>
 import { paraglideVitePlugin } from "@inlang/paraglide-js"
 <% } -%>
+<% if (routerOnly) { %>
+import { tanstackRouter } from '@tanstack/router-plugin/vite'
+<% } else { %>
 import { tanstackStart } from '@tanstack/react-start/plugin/vite';
+<% } %>
 import viteReact from '@vitejs/plugin-react'
-import viteTsConfigPaths from 'vite-tsconfig-paths'
-import { fileURLToPath, URL } from 'node:url'
 import tailwindcss from "@tailwindcss/vite"
 <% for(const integration of integrations.filter(i => i.type === 'vite-plugin')) { %><%- integrationImportContent(integration) %>
 <% } %>
 
 const config = defineConfig({
-  resolve: {
-    alias: {
-      '@': fileURLToPath(new URL('./src', import.meta.url)),
-    },
-  },
   plugins: [devtools(), <% if (addOnEnabled.paraglide) { %>paraglideVitePlugin({
     project: './project.inlang',
     outdir: './src/paraglide',
-    strategy: ['url'],
+    strategy: ['url', "baseLocale"],
   }), <% } %><% for(const integration of integrations.filter(i => i.type === 'vite-plugin')) { %><%- integrationImportCode(integration) %>,<% } %>
-    // this is the plugin that enables path aliases
-    viteTsConfigPaths({
-      projects: ['./tsconfig.json'],
-    }),
+    tsconfigPaths({ projects: ['./tsconfig.json'] }),
     tailwindcss(),
-    tanstackStart(),
+    <% if (routerOnly) { %>tanstackRouter({ target: 'react', autoCodeSplitting: true }),<% } else { %>tanstackStart(),<% } %>
     viteReact(<% if (addOnEnabled.compiler) { %>{
       babel: {
         plugins: ["babel-plugin-react-compiler"],

package/src/frameworks/react/toolchains/eslint/assets/eslint.config.js

@@ -2,4 +2,19 @@
 
 import { tanstackConfig } from '@tanstack/eslint-config'
 
-export default [...tanstackConfig]
+export default [
+  ...tanstackConfig,
+  {
+    rules: {
+      'import/no-cycle': 'off',
+      'import/order': 'off',
+      'sort-imports': 'off',
+      '@typescript-eslint/array-type': 'off',
+      '@typescript-eslint/require-await': 'off',
+      'pnpm/json-enforce-catalog': 'off',
+    },
+  },
+  {
+    ignores: ['eslint.config.js', 'prettier.config.js'],
+  },
+]

package/src/frameworks/solid/project/base/_dot_gitignore

@@ -10,4 +10,3 @@ dist-ssr
 .output
 .vinxi
 __unconfig*
-count.txt

package/src/frameworks/solid/project/base/index.html.ejs

@@ -0,0 +1,13 @@
+<% if (!routerOnly) { ignoreFile() } %>
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title><%= projectName %></title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/src/frameworks/solid/project/base/src/main.tsx.ejs

@@ -0,0 +1,23 @@
+<% if (!routerOnly) { ignoreFile() } %>
+import { render } from 'solid-js/web'
+import { RouterProvider, createRouter } from '@tanstack/solid-router'
+import { routeTree } from './routeTree.gen'
+
+const router = createRouter({
+  routeTree,
+  defaultPreload: 'intent',
+  defaultPreloadStaleTime: 0,
+  scrollRestoration: true,
+})
+
+declare module '@tanstack/solid-router' {
+  interface Register {
+    router: typeof router
+  }
+}
+
+const rootElement = document.getElementById('app')!
+
+if (!rootElement.innerHTML) {
+  render(() => <RouterProvider router={router} />, rootElement)
+}

package/src/frameworks/solid/project/base/src/routes/__root.tsx.ejs

@@ -1,3 +1,22 @@
+<% if (routerOnly) { %>
+import { Outlet, createRootRoute } from '@tanstack/solid-router'
+import { TanStackRouterDevtools } from '@tanstack/solid-router-devtools'
+
+import '../styles.css'
+
+export const Route = createRootRoute({
+  component: RootComponent,
+})
+
+function RootComponent() {
+  return (
+    <>
+      <Outlet />
+      <TanStackRouterDevtools position="bottom-right" />
+    </>
+  )
+}
+<% } else { %>
 import { HeadContent, Outlet, Scripts, createRootRouteWithContext } from '@tanstack/solid-router'
 import { TanStackRouterDevtools } from '@tanstack/solid-router-devtools'
 
@@ -47,3 +66,4 @@ function RootComponent() {
       </html>
     );
 }
+<% } %>

package/src/frameworks/solid/project/base/vite.config.ts.ejs

@@ -2,7 +2,11 @@ import { defineConfig } from "vite";
 import { devtools } from '@tanstack/devtools-vite'
 import viteTsConfigPaths from 'vite-tsconfig-paths'
 import tailwindcss from "@tailwindcss/vite"
+<% if (routerOnly) { %>
+import { tanstackRouter } from '@tanstack/router-plugin/vite'
+<% } else { %>
 import { tanstackStart } from "@tanstack/solid-start/plugin/vite";
+<% } %>
 import solidPlugin from 'vite-plugin-solid';
 <% for(const integration of integrations.filter(i => i.type === 'vite-plugin')) { %><%- integrationImportContent(integration) %>
 <% } %>
@@ -15,7 +19,7 @@ export default defineConfig({
       projects: ['./tsconfig.json'],
     }),
     tailwindcss(),
-    tanstackStart(),
-    solidPlugin({ ssr: true }),
+    <% if (routerOnly) { %>tanstackRouter({ target: 'solid', autoCodeSplitting: true }),<% } else { %>tanstackStart(),<% } %>
+    solidPlugin(<% if (!routerOnly) { %>{ ssr: true }<% } %>),
   ],
 })

package/src/frameworks/solid/toolchains/eslint/assets/eslint.config.js

@@ -2,4 +2,19 @@
 
 import { tanstackConfig } from "@tanstack/eslint-config";
 
-export default [...tanstackConfig];
+export default [
+  ...tanstackConfig,
+  {
+    rules: {
+      "import/no-cycle": "off",
+      "import/order": "off",
+      "sort-imports": "off",
+      "@typescript-eslint/array-type": "off",
+      "@typescript-eslint/require-await": "off",
+      "pnpm/json-enforce-catalog": "off",
+    },
+  },
+  {
+    ignores: ["eslint.config.js", "prettier.config.js"],
+  },
+];

package/src/package-json.ts

@@ -63,6 +63,7 @@ export function createPackageJSON(options: Options) {
         jsx: 'tsx',
         fileRouter: options.mode === 'file-router',
         codeRouter: options.mode === 'code-router',
+        routerOnly: options.routerOnly === true,
         addOnEnabled: options.chosenAddOns.reduce<Record<string, boolean>>(
           (acc, addon) => {
             acc[addon.id] = true
@@ -97,6 +98,29 @@ export function createPackageJSON(options: Options) {
     )
   }
 
+  if (options.routerOnly) {
+    if (options.framework.id === 'react-cra') {
+      delete packageJSON.dependencies?.['@tanstack/react-start']
+      delete packageJSON.dependencies?.['@tanstack/react-router-ssr-query']
+      packageJSON.devDependencies = {
+        ...(packageJSON.devDependencies ?? {}),
+        '@tanstack/router-plugin':
+          packageJSON.devDependencies?.['@tanstack/router-plugin'] ?? '^1.132.0',
+      }
+    }
+
+    if (options.framework.id === 'solid') {
+      delete packageJSON.dependencies?.['@tanstack/solid-start']
+      delete packageJSON.dependencies?.['@tanstack/solid-router-ssr-query']
+      delete packageJSON.scripts?.start
+      packageJSON.devDependencies = {
+        ...(packageJSON.devDependencies ?? {}),
+        '@tanstack/router-plugin':
+          packageJSON.devDependencies?.['@tanstack/router-plugin'] ?? '^1.133.20',
+      }
+    }
+  }
+
   packageJSON.dependencies = sortObject(
     (packageJSON.dependencies ?? {}) as Record<string, string>,
   )

package/src/template-file.ts

@@ -136,6 +136,7 @@ export function createTemplateFile(environment: Environment, options: Options) {
       jsx: 'tsx',
       fileRouter: options.mode === 'file-router',
       codeRouter: options.mode === 'code-router',
+      routerOnly: options.routerOnly === true,
       addOnEnabled,
       addOnOption: options.addOnOptions,
       addOns: options.chosenAddOns,

package/src/types.ts

@@ -206,6 +206,7 @@ export interface Options {
   chosenAddOns: Array<AddOn>
   addOnOptions: Record<string, Record<string, any>>
   starter?: Starter | undefined
+  routerOnly?: boolean
 }
 
 export type SerializedOptions = Omit<