@tanstack/create 0.49.2 → 0.59.4

package/dist/frameworks/solid/project/base/src/routes/index.tsx.ejs

@@ -1,41 +1,103 @@
-<% if (codeRouter) { ignoreFile() } %>import * as Solid from 'solid-js'
-import { createFileRoute } from '@tanstack/solid-router'
+import { createFileRoute } from "@tanstack/solid-router";
+import { For } from "solid-js"
+import {
+  Zap, Server, Route as RouteIcon, Shield, Waves, Sparkles,
+} from "lucide-solid";
 
-import logo from '../logo.svg'
+export const Route = createFileRoute("/")({ component: App });
 
-export const Route = createFileRoute('/')({
-  component: IndexComponent,
-})
+function App() {
+  const features = [
+    {
+      icon: <Zap class="w-12 h-12 text-cyan-400" />,
+      title: "Powerful Server Functions",
+      description: "Write server-side code that seamlessly integrates with your client components. Type-safe, secure, and simple.",
+    },
+    {
+      icon: <Server class="w-12 h-12 text-cyan-400" />,
+      title: "Flexible Server Side Rendering",
+      description: "Full-document SSR, streaming, and progressive enhancement out of the box. Control exactly what renders where.",
+    },
+    {
+      icon: <RouteIcon class="w-12 h-12 text-cyan-400" />,
+      title: "API Routes",
+      description: "Build type-safe API endpoints alongside your application. No separate backend needed.",
+    },
+    {
+      icon: <Shield class="w-12 h-12 text-cyan-400" />,
+      title: "Strongly Typed Everything",
+      description: "End-to-end type safety from server to client. Catch errors before they reach production.",
+    },
+    {
+      icon: <Waves class="w-12 h-12 text-cyan-400" />,
+      title: "Full Streaming Support",
+      description: "Stream data from server to client progressively. Perfect for AI applications and real-time updates.",
+    },
+    {
+      icon: <Sparkles class="w-12 h-12 text-cyan-400" />,
+      title: "Next Generation Ready",
+      description: "Built from the ground up for modern web applications. Deploy anywhere JavaScript runs.",
+    },
+  ];
 
-function IndexComponent() {
   return (
-    <div class="text-center">
-      <header class="min-h-screen flex flex-col items-center justify-center bg-[#282c34] text-white text-[calc(10px+2vmin)]">
-        <img
-          src={logo}
-          class="h-[40vmin] pointer-events-none animate-[spin_20s_linear_infinite]"
-          alt="logo"
-        />
-        <p>
-          Edit <code>src/routes/index.tsx</code> and save to reload.
-        </p>
-        <a
-          class="text-[#61dafb] hover:underline"
-          href="https://solidjs.com"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn Solid
-        </a>
-        <a
-          class="text-[#61dafb] hover:underline"
-          href="https://tanstack.com"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn TanStack
-        </a>
-      </header>
+    <div class="min-h-screen bg-gradient-to-b from-slate-900 via-slate-800 to-slate-900">
+      <section class="relative py-20 px-6 text-center overflow-hidden">
+        <div class="absolute inset-0 bg-gradient-to-r from-cyan-500/10 via-blue-500/10 to-purple-500/10"></div>
+        <div class="relative max-w-5xl mx-auto">
+          <div class="flex items-center justify-center gap-6 mb-6">
+            <img
+              src="/tanstack-circle-logo.png"
+              alt="TanStack Logo"
+              class="w-24 h-24 md:w-32 md:h-32"
+            />
+            <h1 class="text-6xl md:text-7xl font-black text-white [letter-spacing:-0.08em]">
+              <span class="text-gray-300">TANSTACK</span>{" "}
+              <span class="bg-gradient-to-r from-cyan-400 to-blue-400 bg-clip-text text-transparent">
+                START
+              </span>
+            </h1>
+          </div>
+          <p class="text-2xl md:text-3xl text-gray-300 mb-4 font-light">
+            The framework for next generation AI applications
+          </p>
+          <p class="text-lg text-gray-400 max-w-3xl mx-auto mb-8">
+            Full-stack framework powered by TanStack Router for React and Solid.
+            Build modern applications with server functions, streaming, and type
+            safety.
+          </p>
+          <div class="flex flex-col items-center gap-4">
+            <a
+              href="https://tanstack.com/start"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="px-8 py-3 bg-cyan-500 hover:bg-cyan-600 text-white font-semibold rounded-lg transition-colors shadow-lg shadow-cyan-500/50"
+            >
+              Documentation
+            </a>
+            <p class="text-gray-400 text-sm mt-2">
+              Begin your TanStack Start journey by editing{" "}
+              <code class="px-2 py-1 bg-slate-700 rounded text-cyan-400">
+                /src/routes/index.tsx
+              </code>
+            </p>
+          </div>
+        </div>
+      </section>
+
+      <section class="py-16 px-6 max-w-7xl mx-auto">
+        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          <For each={features}>
+            {(feature) => (
+              <div class="bg-slate-800/50 backdrop-blur-sm border border-slate-700 rounded-xl p-6 hover:border-cyan-500/50 transition-all duration-300 hover:shadow-lg hover:shadow-cyan-500/10">
+                <div class="mb-4">{feature.icon}</div>
+                <h3 class="text-xl font-semibold text-white mb-3">{feature.title}</h3>
+                <p class="text-gray-400 leading-relaxed">{feature.description}</p>
+              </div>
+            )}
+          </For>
+        </div>
+      </section>
     </div>
-  )
+  );
 }

package/dist/frameworks/solid/project/base/tsconfig.json.ejs

@@ -1,4 +1,4 @@
-<% if (!typescript) { ignoreFile() } %>{
+{
   <% if (addOnEnabled.eslint) { %>"include": ["**/*.ts", "**/*.tsx", "eslint.config.js", "prettier.config.js", "vite.config.js"],
   <% } else { %>"include": ["**/*.ts", "**/*.tsx"],<% } %>
   "compilerOptions": {

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

@@ -1,26 +1,21 @@
-<% if (addOnEnabled['start']) { ignoreFile() } %>import { defineConfig } from 'vite'
+import { defineConfig } from "vite";
 import { devtools } from '@tanstack/devtools-vite'
-<%if (fileRouter) { %>import { TanStackRouterVite } from '@tanstack/router-plugin/vite'<% } %>
-import solidPlugin from 'vite-plugin-solid'
-import tailwindcss from '@tailwindcss/vite'<% if (addOnEnabled['solid-ui']) { %>
-import { resolve } from 'node:path'<% } %><% if (addOnEnabled['module-federation']) { %>
-import { federation } from "@module-federation/vite";<% } %><% if (addOnEnabled['module-federation']) { %>
-import federationConfig from "./module-federation.config.js";
-<% } %><% for(const integration of integrations.filter(i => i.type === 'vite-plugin')) { %>
-<%- integrationImportContent(integration) %>
+import viteTsConfigPaths from 'vite-tsconfig-paths'
+import tailwindcss from "@tailwindcss/vite"
+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) %>
 <% } %>
+import lucidePreprocess from "vite-plugin-lucide-preprocess";
 
-// https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [devtools(), <% for(const integration of integrations.filter(i => i.type === 'vite-plugin')) { %><%- integrationImportCode(integration) %>,<% } %>
-    <% if (addOnEnabled['module-federation']) { %>federation(federationConfig), <% } %><%if (fileRouter) { %>
-    TanStackRouterVite({ target: 'solid', autoCodeSplitting: true }),<% } %>
-    solidPlugin(),
+  plugins: [lucidePreprocess(), devtools(), <% 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'],
+    }),
     tailwindcss(),
-  ],<% if (addOnEnabled['solid-ui']) { %>
-  resolve: {
-    alias: {
-      '~': resolve(__dirname, './src'),
-    },
-  },<% } %>
+    tanstackStart(),
+    solidPlugin({ ssr: true }),
+  ],
 })

package/dist/frameworks/solid/project/packages.json

@@ -6,8 +6,8 @@
   },
   "tailwindcss": {
     "dependencies": {
-      "@tailwindcss/vite": "^4.0.6",
-      "tailwindcss": "^4.0.6"
+      "@tailwindcss/vite": "^4.1.18",
+      "tailwindcss": "^4.1.18"
     }
   },
   "file-router": {

package/dist/frameworks.js

@@ -28,7 +28,6 @@ export function scanAddOnDirectories(addOnsDirectories) {
             const filePath = resolve(addOnsBase, dir, 'info.json');
             const fileContent = readFileSync(filePath, 'utf-8');
             const info = JSON.parse(fileContent);
-            info.tailwind = info.tailwind ?? true;
             let packageAdditions = {};
             let packageTemplate = undefined;
             if (existsSync(resolve(addOnsBase, dir, 'package.json'))) {

package/dist/package-json.js

@@ -24,12 +24,8 @@ export function createPackageJSON(options) {
         name: options.projectName,
     };
     const additions = [
-        options.typescript
-            ? options.framework.optionalPackages.typescript
-            : undefined,
-        options.tailwind
-            ? options.framework.optionalPackages.tailwindcss
-            : undefined,
+        options.framework.optionalPackages.typescript,
+        options.framework.optionalPackages.tailwindcss,
         options.mode ? options.framework.optionalPackages[options.mode] : undefined,
     ];
     for (const addition of additions.filter(Boolean)) {
@@ -42,10 +38,10 @@ export function createPackageJSON(options) {
             const templateValues = {
                 packageManager: options.packageManager,
                 projectName: options.projectName,
-                typescript: options.typescript,
-                tailwind: options.tailwind,
-                js: options.typescript ? 'ts' : 'js',
-                jsx: options.typescript ? 'tsx' : 'jsx',
+                typescript: true,
+                tailwind: true,
+                js: 'ts',
+                jsx: 'tsx',
                 fileRouter: options.mode === 'file-router',
                 codeRouter: options.mode === 'code-router',
                 addOnEnabled: options.chosenAddOns.reduce((acc, addon) => {

package/dist/template-file.js

@@ -10,6 +10,22 @@ function convertDotFilesAndPaths(path) {
         .map((segment) => segment.replace(/^_dot_/, '.'))
         .join(sep);
 }
+function normalizeSourceExtension(target, typescript) {
+    if (!typescript) {
+        return target;
+    }
+    const normalizedTarget = target.replace(/\\/g, '/');
+    if (!normalizedTarget.startsWith('src/')) {
+        return target;
+    }
+    if (normalizedTarget.endsWith('.js')) {
+        return `${target.slice(0, -3)}.ts`;
+    }
+    if (normalizedTarget.endsWith('.jsx')) {
+        return `${target.slice(0, -4)}.tsx`;
+    }
+    return target;
+}
 export function createTemplateFile(environment, options) {
     function getPackageManagerAddScript(packageName, isDev = false) {
         return formatCommand(getPackageManagerInstallCommand(options.packageManager, packageName, isDev));
@@ -57,10 +73,10 @@ export function createTemplateFile(environment, options) {
         const templateValues = {
             packageManager: options.packageManager,
             projectName: options.projectName,
-            typescript: options.typescript,
-            tailwind: options.tailwind,
-            js: options.typescript ? 'ts' : 'js',
-            jsx: options.typescript ? 'tsx' : 'jsx',
+            typescript: true,
+            tailwind: true,
+            js: 'ts',
+            jsx: 'tsx',
             fileRouter: options.mode === 'file-router',
             codeRouter: options.mode === 'code-router',
             addOnEnabled,
@@ -97,6 +113,7 @@ export function createTemplateFile(environment, options) {
             return;
         }
         let target = convertDotFilesAndPaths(file.replace('.ejs', ''));
+        target = normalizeSourceExtension(target, options.typescript);
         // Strip option prefixes from filename (e.g., __postgres__schema.prisma -> schema.prisma)
         const prefixMatch = target.match(/^(.+\/)?__([^_]+)__(.+)$/);
         if (prefixMatch) {
@@ -116,9 +133,6 @@ export function createTemplateFile(environment, options) {
                 parser: 'typescript',
             });
         }
-        if (!options.typescript) {
-            target = target.replace(/\.tsx$/, '.jsx').replace(/\.ts$/, '.js');
-        }
         if (append) {
             await environment.appendFile(resolve(options.targetDir, target), content);
         }

package/dist/types/custom-add-ons/add-on.d.ts

@@ -16,7 +16,6 @@ export declare function generateProject(persistedOptions: PersistedOptions): Pro
         description: string;
         id: string;
         name: string;
-        tailwind: boolean;
         modes: string[];
         phase: "add-on" | "setup";
         command?: {
@@ -39,6 +38,7 @@ export declare function generateProject(persistedOptions: PersistedOptions): Pro
         link?: string | undefined;
         license?: string | undefined;
         warning?: string | undefined;
+        tailwind?: boolean | undefined;
         category?: "other" | "tanstack" | "database" | "orm" | "auth" | "deploy" | "styling" | "monitoring" | "cms" | "api" | "i18n" | "tooling" | undefined;
         exclusive?: ("database" | "orm" | "auth" | "deploy" | "linter")[] | undefined;
         color?: string | undefined;

package/dist/types/file-helpers.d.ts

@@ -5,7 +5,6 @@ export declare function convertBinaryContentsToBase64(contents: any): string;
 export declare function isBase64(content: string): boolean;
 export declare function getBinaryFile(content: string): string | null;
 /**
- * Convert an absolute path to a clean relative path by removing a base directory.
  * Returns a path without leading ./ or / prefix.
  */
 export declare function toCleanPath(absolutePath: string, baseDir: string): string;

package/dist/types/types.d.ts

@@ -112,7 +112,7 @@ export declare const AddOnBaseSchema: z.ZodObject<{
     link: z.ZodOptional<z.ZodString>;
     license: z.ZodOptional<z.ZodString>;
     warning: z.ZodOptional<z.ZodString>;
-    tailwind: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
+    tailwind: z.ZodOptional<z.ZodBoolean>;
     type: z.ZodEnum<["add-on", "example", "starter", "toolchain", "deployment"]>;
     category: z.ZodOptional<z.ZodEnum<["tanstack", "database", "orm", "auth", "deploy", "styling", "monitoring", "cms", "api", "i18n", "tooling", "other"]>>;
     exclusive: z.ZodOptional<z.ZodArray<z.ZodEnum<["orm", "auth", "deploy", "database", "linter"]>, "many">>;
@@ -204,7 +204,6 @@ export declare const AddOnBaseSchema: z.ZodObject<{
     description: string;
     id: string;
     name: string;
-    tailwind: boolean;
     command?: {
         command: string;
         args?: string[] | undefined;
@@ -225,6 +224,7 @@ export declare const AddOnBaseSchema: z.ZodObject<{
     link?: string | undefined;
     license?: string | undefined;
     warning?: string | undefined;
+    tailwind?: boolean | undefined;
     category?: "other" | "tanstack" | "database" | "orm" | "auth" | "deploy" | "styling" | "monitoring" | "cms" | "api" | "i18n" | "tooling" | undefined;
     exclusive?: ("database" | "orm" | "auth" | "deploy" | "linter")[] | undefined;
     color?: string | undefined;
@@ -305,6 +305,7 @@ export declare const StarterSchema: z.ZodObject<{
     link: z.ZodOptional<z.ZodString>;
     license: z.ZodOptional<z.ZodString>;
     warning: z.ZodOptional<z.ZodString>;
+    tailwind: z.ZodOptional<z.ZodBoolean>;
     type: z.ZodEnum<["add-on", "example", "starter", "toolchain", "deployment"]>;
     category: z.ZodOptional<z.ZodEnum<["tanstack", "database", "orm", "auth", "deploy", "styling", "monitoring", "cms", "api", "i18n", "tooling", "other"]>>;
     exclusive: z.ZodOptional<z.ZodArray<z.ZodEnum<["orm", "auth", "deploy", "database", "linter"]>, "many">>;
@@ -395,14 +396,12 @@ export declare const StarterSchema: z.ZodObject<{
     framework: z.ZodString;
     mode: z.ZodString;
     typescript: z.ZodBoolean;
-    tailwind: z.ZodBoolean;
     banner: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
     type: "add-on" | "example" | "starter" | "toolchain" | "deployment";
     description: string;
     id: string;
     name: string;
-    tailwind: boolean;
     framework: string;
     mode: string;
     typescript: boolean;
@@ -426,6 +425,7 @@ export declare const StarterSchema: z.ZodObject<{
     link?: string | undefined;
     license?: string | undefined;
     warning?: string | undefined;
+    tailwind?: boolean | undefined;
     category?: "other" | "tanstack" | "database" | "orm" | "auth" | "deploy" | "styling" | "monitoring" | "cms" | "api" | "i18n" | "tooling" | undefined;
     exclusive?: ("database" | "orm" | "auth" | "deploy" | "linter")[] | undefined;
     color?: string | undefined;
@@ -454,7 +454,6 @@ export declare const StarterSchema: z.ZodObject<{
     description: string;
     id: string;
     name: string;
-    tailwind: boolean;
     framework: string;
     mode: string;
     typescript: boolean;
@@ -478,6 +477,7 @@ export declare const StarterSchema: z.ZodObject<{
     link?: string | undefined;
     license?: string | undefined;
     warning?: string | undefined;
+    tailwind?: boolean | undefined;
     category?: "other" | "tanstack" | "database" | "orm" | "auth" | "deploy" | "styling" | "monitoring" | "cms" | "api" | "i18n" | "tooling" | undefined;
     exclusive?: ("database" | "orm" | "auth" | "deploy" | "linter")[] | undefined;
     color?: string | undefined;
@@ -511,6 +511,7 @@ export declare const StarterCompiledSchema: z.ZodObject<{
     link: z.ZodOptional<z.ZodString>;
     license: z.ZodOptional<z.ZodString>;
     warning: z.ZodOptional<z.ZodString>;
+    tailwind: z.ZodOptional<z.ZodBoolean>;
     type: z.ZodEnum<["add-on", "example", "starter", "toolchain", "deployment"]>;
     category: z.ZodOptional<z.ZodEnum<["tanstack", "database", "orm", "auth", "deploy", "styling", "monitoring", "cms", "api", "i18n", "tooling", "other"]>>;
     exclusive: z.ZodOptional<z.ZodArray<z.ZodEnum<["orm", "auth", "deploy", "database", "linter"]>, "many">>;
@@ -601,7 +602,6 @@ export declare const StarterCompiledSchema: z.ZodObject<{
     framework: z.ZodString;
     mode: z.ZodString;
     typescript: z.ZodBoolean;
-    tailwind: z.ZodBoolean;
     banner: z.ZodOptional<z.ZodString>;
 } & {
     files: z.ZodRecord<z.ZodString, z.ZodString>;
@@ -611,7 +611,6 @@ export declare const StarterCompiledSchema: z.ZodObject<{
     description: string;
     id: string;
     name: string;
-    tailwind: boolean;
     framework: string;
     mode: string;
     typescript: boolean;
@@ -637,6 +636,7 @@ export declare const StarterCompiledSchema: z.ZodObject<{
     link?: string | undefined;
     license?: string | undefined;
     warning?: string | undefined;
+    tailwind?: boolean | undefined;
     category?: "other" | "tanstack" | "database" | "orm" | "auth" | "deploy" | "styling" | "monitoring" | "cms" | "api" | "i18n" | "tooling" | undefined;
     exclusive?: ("database" | "orm" | "auth" | "deploy" | "linter")[] | undefined;
     color?: string | undefined;
@@ -665,7 +665,6 @@ export declare const StarterCompiledSchema: z.ZodObject<{
     description: string;
     id: string;
     name: string;
-    tailwind: boolean;
     framework: string;
     mode: string;
     typescript: boolean;
@@ -691,6 +690,7 @@ export declare const StarterCompiledSchema: z.ZodObject<{
     link?: string | undefined;
     license?: string | undefined;
     warning?: string | undefined;
+    tailwind?: boolean | undefined;
     category?: "other" | "tanstack" | "database" | "orm" | "auth" | "deploy" | "styling" | "monitoring" | "cms" | "api" | "i18n" | "tooling" | undefined;
     exclusive?: ("database" | "orm" | "auth" | "deploy" | "linter")[] | undefined;
     color?: string | undefined;
@@ -743,7 +743,7 @@ export declare const AddOnInfoSchema: z.ZodObject<{
     link: z.ZodOptional<z.ZodString>;
     license: z.ZodOptional<z.ZodString>;
     warning: z.ZodOptional<z.ZodString>;
-    tailwind: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
+    tailwind: z.ZodOptional<z.ZodBoolean>;
     type: z.ZodEnum<["add-on", "example", "starter", "toolchain", "deployment"]>;
     category: z.ZodOptional<z.ZodEnum<["tanstack", "database", "orm", "auth", "deploy", "styling", "monitoring", "cms", "api", "i18n", "tooling", "other"]>>;
     exclusive: z.ZodOptional<z.ZodArray<z.ZodEnum<["orm", "auth", "deploy", "database", "linter"]>, "many">>;
@@ -858,7 +858,6 @@ export declare const AddOnInfoSchema: z.ZodObject<{
     description: string;
     id: string;
     name: string;
-    tailwind: boolean;
     modes: string[];
     phase: "add-on" | "setup";
     command?: {
@@ -881,6 +880,7 @@ export declare const AddOnInfoSchema: z.ZodObject<{
     link?: string | undefined;
     license?: string | undefined;
     warning?: string | undefined;
+    tailwind?: boolean | undefined;
     category?: "other" | "tanstack" | "database" | "orm" | "auth" | "deploy" | "styling" | "monitoring" | "cms" | "api" | "i18n" | "tooling" | undefined;
     exclusive?: ("database" | "orm" | "auth" | "deploy" | "linter")[] | undefined;
     color?: string | undefined;
@@ -979,7 +979,7 @@ export declare const AddOnCompiledSchema: z.ZodObject<{
     link: z.ZodOptional<z.ZodString>;
     license: z.ZodOptional<z.ZodString>;
     warning: z.ZodOptional<z.ZodString>;
-    tailwind: z.ZodDefault<z.ZodOptional<z.ZodBoolean>>;
+    tailwind: z.ZodOptional<z.ZodBoolean>;
     type: z.ZodEnum<["add-on", "example", "starter", "toolchain", "deployment"]>;
     category: z.ZodOptional<z.ZodEnum<["tanstack", "database", "orm", "auth", "deploy", "styling", "monitoring", "cms", "api", "i18n", "tooling", "other"]>>;
     exclusive: z.ZodOptional<z.ZodArray<z.ZodEnum<["orm", "auth", "deploy", "database", "linter"]>, "many">>;
@@ -1098,7 +1098,6 @@ export declare const AddOnCompiledSchema: z.ZodObject<{
     description: string;
     id: string;
     name: string;
-    tailwind: boolean;
     files: Record<string, string>;
     deletedFiles: string[];
     modes: string[];
@@ -1123,6 +1122,7 @@ export declare const AddOnCompiledSchema: z.ZodObject<{
     link?: string | undefined;
     license?: string | undefined;
     warning?: string | undefined;
+    tailwind?: boolean | undefined;
     category?: "other" | "tanstack" | "database" | "orm" | "auth" | "deploy" | "styling" | "monitoring" | "cms" | "api" | "i18n" | "tooling" | undefined;
     exclusive?: ("database" | "orm" | "auth" | "deploy" | "linter")[] | undefined;
     color?: string | undefined;

package/dist/types.js

@@ -22,7 +22,7 @@ export const AddOnBaseSchema = z.object({
     link: z.string().optional(),
     license: z.string().optional(),
     warning: z.string().optional(),
-    tailwind: z.boolean().optional().default(true),
+    tailwind: z.boolean().optional(),
     type: z.enum(['add-on', 'example', 'starter', 'toolchain', 'deployment']),
     category: z
         .enum([
@@ -80,7 +80,6 @@ export const StarterSchema = AddOnBaseSchema.extend({
     framework: z.string(),
     mode: z.string(),
     typescript: z.boolean(),
-    tailwind: z.boolean(),
     banner: z.string().optional(),
 });
 export const StarterCompiledSchema = StarterSchema.extend({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/create",
-  "version": "0.49.2",
+  "version": "0.59.4",
   "description": "TanStack Application Builder Engine",
   "type": "module",
   "main": "./dist/index.js",
@@ -44,7 +44,7 @@
   },
   "scripts": {
     "build": "tsc && npm run copy-assets",
-    "copy-assets": "node -e \"const fs=require('fs');const path=require('path');function copyDir(src,dest){if(!fs.existsSync(dest))fs.mkdirSync(dest,{recursive:true});for(const entry of fs.readdirSync(src,{withFileTypes:true})){const srcPath=path.join(src,entry.name);const destPath=path.join(dest,entry.name);if(entry.isDirectory())copyDir(srcPath,destPath);else if(!entry.name.endsWith('.ts')||entry.name.endsWith('.d.ts'))fs.copyFileSync(srcPath,destPath)}}['react','solid'].forEach(fw=>{['add-ons','toolchains','hosts','examples','project'].forEach(dir=>{const src='src/frameworks/'+fw+'/'+dir;const dest='dist/frameworks/'+fw+'/'+dir;if(fs.existsSync(src))copyDir(src,dest)})})\"",
+    "copy-assets": "node -e \"const fs=require('fs');const path=require('path');function copyDir(src,dest){if(!fs.existsSync(dest))fs.mkdirSync(dest,{recursive:true});for(const entry of fs.readdirSync(src,{withFileTypes:true})){const srcPath=path.join(src,entry.name);const destPath=path.join(dest,entry.name);if(entry.isDirectory())copyDir(srcPath,destPath);else fs.copyFileSync(srcPath,destPath)}}['react','solid'].forEach(fw=>{['add-ons','toolchains','hosts','examples','project'].forEach(dir=>{const src='src/frameworks/'+fw+'/'+dir;const dest='dist/frameworks/'+fw+'/'+dir;if(fs.existsSync(src))copyDir(src,dest)})})\"",
     "dev": "tsc --watch",
     "test": "eslint ./src && vitest run",
     "test:watch": "vitest",

package/src/add-ons.ts

@@ -25,14 +25,24 @@ export async function finalizeAddOns(
 
   for (const addOnID of finalAddOnIDs) {
     let addOn: AddOn | undefined
-    const localAddOn = addOns.find((a) => a.id === addOnID)
+    const localAddOn =
+      addOns.find((a) => a.id === addOnID) ??
+      addOns.find((a) => a.id.toLowerCase() === addOnID.toLowerCase())
     if (localAddOn) {
       addOn = loadAddOn(localAddOn)
+      if (localAddOn.id !== addOnID) {
+        // Replace the mistyped ID with the canonical one
+        finalAddOnIDs.delete(addOnID)
+        finalAddOnIDs.add(localAddOn.id)
+      }
     } else if (addOnID.startsWith('http')) {
       addOn = await loadRemoteAddOn(addOnID)
       addOns.push(addOn)
     } else {
-      throw new Error(`Add-on ${addOnID} not found`)
+      const suggestion = findClosestAddOn(addOnID, addOns)
+      throw new Error(
+        `Add-on ${addOnID} not found${suggestion ? `. Did you mean "${suggestion}"?` : ''}`,
+      )
     }
 
     for (const dependsOn of addOn.dependsOn || []) {
@@ -55,6 +65,48 @@ function loadAddOn(addOn: AddOn): AddOn {
   return addOn
 }
 
+function findClosestAddOn(
+  input: string,
+  addOns: Array<AddOn>,
+): string | undefined {
+  const inputLower = input.toLowerCase()
+  let bestMatch: string | undefined
+  let bestDistance = Infinity
+
+  for (const addOn of addOns) {
+    const d = levenshtein(inputLower, addOn.id.toLowerCase())
+    if (d < bestDistance) {
+      bestDistance = d
+      bestMatch = addOn.id
+    }
+  }
+
+  // Only suggest if the distance is reasonable (less than half the input length)
+  if (bestMatch && bestDistance <= Math.max(Math.floor(input.length / 2), 2)) {
+    return bestMatch
+  }
+  return undefined
+}
+
+function levenshtein(a: string, b: string): number {
+  const m = a.length
+  const n = b.length
+  let prev = Array.from({ length: n + 1 }, (_, j) => j)
+
+  for (let i = 1; i <= m; i++) {
+    const curr = [i]
+    for (let j = 1; j <= n; j++) {
+      curr[j] =
+        a[i - 1] === b[j - 1]
+          ? prev[j - 1]
+          : 1 + Math.min(prev[j], curr[j - 1], prev[j - 1])
+    }
+    prev = curr
+  }
+
+  return prev[n]
+}
+
 export function populateAddOnOptionsDefaults(
   chosenAddOns: Array<AddOn>,
 ): Record<string, Record<string, any>> {