create-tanstack-app 0.15.3

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021-present Tanner Linsley
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,164 @@
+# Create React App for TanStack Router
+
+This CLI application builds Tanstack Router applications that are the functional equivalent of [Create React App](https://create-react-app.dev/).
+
+To help accelerate the migration away from `create-react-app` we created the `create-tanstack-app` CLI which is a plug-n-play replacement for CRA.
+
+## Quick Start
+
+To maintain compatability with `create-react-app` you can build a new application by running:
+
+| Command                                                                           | Description                                       |
+| --------------------------------------------------------------------------------- | ------------------------------------------------- |
+| `pnpx create-tanstack-app@latest my-app`                                          | Create a new app                                  |
+| `pnpx create-tanstack-app@latest my-app --template file-router`                   | Create a new file based app                       |
+| `pnpx create-tanstack-app@latest my-app --template typescript`                    | Create a new TypeScript app using the Code Router |
+| `pnpx create-tanstack-app@latest my-app --tailwind`                               | Add Tailwind CSS support                          |
+| `pnpx create-tanstack-app@latest my-app --framework solid`                        | Create a Solid app                                |
+| `pnpx create-tanstack-app@latest my-app --framework solid --template file-router` | Create a Solid app with file-router               |
+
+If you don't specify a project name, the CLI will walk you through an interactive setup process:
+
+```bash
+pnpx create-tanstack-app@latest
+```
+
+This will start an interactive CLI that guides you through the setup process, allowing you to choose:
+
+- Project Name
+- Router Type (File-based or Code-based routing)
+- TypeScript support
+- Tailwind CSS integration
+- Package manager
+- Toolchain
+- Git initialization
+
+## Command Line Options
+
+You can also use command line flags to specify your preferences directly:
+
+```bash
+pnpx create-tanstack-app@latest my-app --template file-router --tailwind --package-manager pnpm
+```
+
+Available options:
+
+- `--template <type>`: Choose between `file-router`, `typescript`, or `javascript`
+- `--tailwind`: Enable Tailwind CSS
+- `--package-manager`: Specify your preferred package manager (`npm`, `yarn`, `pnpm`, `bun`, or `deno`)
+- `--toolchain`: Specify your toolchain solution for formatting/linting (`biome`, `eslint+prettier`)
+- `--no-git`: Do not initialize a git repository
+- `--add-ons`: Enable add-on selection or specify add-ons to install
+
+When using flags, the CLI will display which options were provided and only prompt for the remaining choices.
+
+## Features
+
+What you'll get is a Vite application that uses TanStack Router. All the files will still be in the same place as in CRA, but you'll get a fully functional Router setup under in `app/main.tsx`.
+
+`create-tanstack-app` is everything you loved about CRA but implemented with modern tools and best practices, on top of the popular TanStack set of libraries. Which includes [@tanstack/react-query](https://tanstack.com/query/latest) and [@tanstack/react-router](https://tanstack.com/router/latest).
+
+## Routing Options
+
+### File Based Routing (Recommended)
+
+File Based Routing is the default option when using the interactive CLI. The location of the home page will be `app/routes/index.tsx`. This approach provides a more intuitive and maintainable way to structure your routes.
+
+To explicitly choose File Based Routing, use:
+
+```bash
+pnpx create-tanstack-app@latest my-app --template file-router
+```
+
+### Code Based Routing
+
+If you prefer traditional code-based routing, you can select it in the interactive CLI or specify it by using either the `typescript` or `javascript` template:
+
+```bash
+pnpx create-tanstack-app@latest my-app --template typescript
+```
+
+## Additional Configuration
+
+### TypeScript
+
+- File Based Routing always uses TypeScript
+- For Code Based Routing, you can choose between TypeScript and JavaScript
+- Enable TypeScript explicitly with `--template typescript`
+
+### Tailwind CSS
+
+Enable Tailwind CSS either through the interactive CLI or by adding the `--tailwind` flag. This will automatically configure [Tailwind V4](https://tailwindcss.com/).
+
+### Package Manager
+
+Choose your preferred package manager (`npm`, `bun`, `yarn`, `pnpm`, or `deno`) either through the interactive CLI or using the `--package-manager` flag.
+
+Extensive documentation on using the TanStack Router, migrating to a File Base Routing approach, as well as integrating [@tanstack/react-query](https://tanstack.com/query/latest) and [@tanstack/store](https://tanstack.com/store/latest) can be found in the generated `README.md` for your project.
+
+### Toolchain
+
+Choose your preferred solution for formatting and linting either through the interactive CLI or using the `--toolchain` flag.
+
+Setting this flag to `biome` will configure it as your toolchain of choice, adding a `biome.json` to the root of the project. Consult the [biome documentation](https://biomejs.dev/guides/getting-started/) for further customization.
+
+Setting this flag to `eslint+prettier` will configure it as your toolchain of choice, adding an `eslint.config.js` and `prettier.config.js` to the root of the project, as well as a `.prettierignore` file. Consult the [eslint documentation](https://eslint.org/docs/latest/) and [prettier documentation](https://prettier.io/docs/) for further customization.
+
+## Add-ons (experimental)
+
+You can enable add-on selection:
+
+```bash
+pnpx create-tanstack-app@latest --add-ons
+```
+
+This will prompt you to select the add-ons you want to enable during application creation.
+
+You can enable specific add-ons directly by adding a comma separated list of add-on names to the `--add-ons` flag. For example:
+
+```bash
+pnpx create-tanstack-app@latest my-app --add-ons shadcn,tanstack-query
+```
+
+You can get a list of all available add-ons by running:
+
+```bash
+pnpx create-tanstack-app@latest --list-add-ons
+```
+
+This will display a list of all available add-ons for React that are compatible with the Code Router.
+
+```bash
+pnpx create-tanstack-app@latest --list-add-ons --framework solid --template file-router
+```
+
+Will get you a list of all available add-ons for Solid that are compatible with the File Router.
+
+## MCP (Model Context Protocol) Support (experimental)
+
+You can launch the `create-tanstack-app` CLI with the `--mcp` flag to enable MCP support. Use this in your MCP enabled IDE to allow the Agent model to generate TanStack Router applications.
+
+```bash
+pnpx create-tanstack-app@latest --mcp
+```
+
+Here is the JSON configuration for MCP support in many MCP clients.
+
+```json
+{
+  "mcpServers": {
+    "create-tanstack-app": {
+      "command": "pnpx",
+      "args": ["create-tanstack-app@latest", "--mcp"]
+    }
+  }
+}
+```
+
+# Contributing
+
+Check out the [Contributing](CONTRIBUTING.md) guide.
+
+# License
+
+MIT

package/dist/index.js

@@ -0,0 +1,11 @@
+#!/usr/bin/env node
+import { cli } from '@tanstack/cta-cli';
+import { register as registerReactCra } from '@tanstack/cta-framework-react-cra';
+import { register as registerSolid } from '@tanstack/cta-framework-solid';
+registerReactCra();
+registerSolid();
+cli({
+    name: 'create-tanstack-app',
+    appName: 'TanStack',
+    defaultTemplate: 'file-router',
+});

package/package.json

@@ -0,0 +1,35 @@
+{
+  "name": "create-tanstack-app",
+  "version": "0.15.3",
+  "description": "Tanstack Application Builder",
+  "bin": "./dist/index.js",
+  "type": "module",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/TanStack/create-tsrouter-app.git"
+  },
+  "homepage": "https://tanstack.com/router",
+  "funding": {
+    "type": "github",
+    "url": "https://github.com/sponsors/tannerlinsley"
+  },
+  "keywords": [
+    "react",
+    "tanstack",
+    "router",
+    "tanstack start",
+    "create-react-app"
+  ],
+  "author": "Jack Herrington <jherr@pobox.com>",
+  "license": "MIT",
+  "dependencies": {
+    "@tanstack/cta-cli": "0.15.3",
+    "@tanstack/cta-framework-solid": "0.15.3",
+    "@tanstack/cta-framework-react-cra": "0.15.3"
+  },
+  "devDependencies": {
+    "@types/node": "^22.13.4",
+    "typescript": "^5.6.3"
+  },
+  "scripts": {}
+}

package/src/index.ts

@@ -0,0 +1,14 @@
+#!/usr/bin/env node
+import { cli } from '@tanstack/cta-cli'
+
+import { register as registerReactCra } from '@tanstack/cta-framework-react-cra'
+import { register as registerSolid } from '@tanstack/cta-framework-solid'
+
+registerReactCra()
+registerSolid()
+
+cli({
+  name: 'create-tanstack-app',
+  appName: 'TanStack',
+  defaultTemplate: 'file-router',
+})

package/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "ES2020",
+    "outDir": "./dist",
+    "rootDir": "./src",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node"
+  },
+  "include": ["./src/**/*.ts"],
+  "exclude": ["node_modules", "dist"]
+}