create-tsrouter-app 0.9.7 → 0.10.0-alpha.3

package/README.md

@@ -46,7 +46,7 @@ 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`)
+- `--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
 
@@ -102,6 +102,8 @@ Choose your preferred solution for formatting and linting either through the int
 
 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:

package/dist/index.js

@@ -1,3 +1,3 @@
 #!/usr/bin/env node
-import { cli } from './cli.js';
+import { cli } from 'engine';
 cli();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-tsrouter-app",
-  "version": "0.9.7",
+  "version": "0.10.0-alpha.3",
   "description": "Tanstack Application Builder",
   "bin": "./dist/index.js",
   "type": "module",
@@ -22,25 +22,10 @@
   "author": "Jack Herrington <jherr@pobox.com>",
   "license": "MIT",
   "dependencies": {
-    "@clack/prompts": "^0.10.0",
-    "@modelcontextprotocol/sdk": "^1.6.0",
-    "chalk": "^5.4.1",
-    "commander": "^13.1.0",
-    "ejs": "^3.1.10",
-    "execa": "^9.5.2",
-    "express": "^4.21.2",
-    "prettier": "^3.5.0",
-    "vitest": "^3.0.8",
-    "zod": "^3.24.2"
+    "engine": "0.11.0-alpha.2"
   },
   "devDependencies": {
-    "@tanstack/config": "^0.16.2",
-    "@types/ejs": "^3.1.5",
-    "@types/express": "^5.0.0",
     "@types/node": "^22.13.4",
-    "eslint": "^9.20.0",
-    "eslint-plugin-react-hooks": "^5.1.0",
-    "eslint-plugin-unused-imports": "^4.1.4",
     "typescript": "^5.6.3"
   },
   "scripts": {}

package/project.json

@@ -0,0 +1,16 @@
+{
+  "name": "create-tsrouter-app",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "cli/create-tsrouter-app/src",
+  "projectType": "application",
+  "targets": {
+    "build": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "tsc -p cli/create-tsrouter-app/tsconfig.json"
+      },
+      "dependsOn": ["^build"]
+    }
+  },
+  "implicitDependencies": ["engine", "templates"]
+}

package/src/index.ts

@@ -1,4 +1,4 @@
 #!/usr/bin/env node
-import { cli } from './cli.js'
+import { cli } from 'engine'
 
 cli()

package/tsconfig.json

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

package/.gitattributes

@@ -1,2 +0,0 @@
-# Auto detect text files and perform LF normalization
-* text=auto

package/.github/FUNDING.yml

@@ -1 +0,0 @@
-github: tannerlinsley

package/.github/ISSUE_TEMPLATE/bug_report.yml

@@ -1,94 +0,0 @@
-name: '🐛 Bug report'
-description: Create a report to help us improve
-body:
-  - type: markdown
-    attributes:
-      value: |
-        Thank you for reporting an issue :pray:.
-
-        This issue tracker is for reporting bugs found in `create-tsrouter-app` (https://github.com/tanstack/create-tsrouter-app).
-        If you have a question about how to achieve something and are struggling, please post a question
-        inside of `create-tsrouter-app` Discussions tab: https://github.com/tanstack/create-tsrouter-app/discussions
-
-        Before submitting a new bug/issue, please check the links below to see if there is a solution or question posted there already:
-         - `create-tsrouter-app` Issues tab: https://github.com/tanstack/create-tsrouter-app/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc
-         - `create-tsrouter-app` closed issues tab: https://github.com/tanstack/create-tsrouter-app/issues?q=is%3Aissue+sort%3Aupdated-desc+is%3Aclosed
-         - `create-tsrouter-app` Discussions tab: https://github.com/tanstack/create-tsrouter-app/discussions
-
-        The more information you fill in, the better the community can help you.
-  - type: dropdown
-    id: project
-    attributes:
-      label: Which project does this relate to?
-      description: If you are unsure, please leave this as "Create Tanstack App".
-      options:
-        - Create Tanstack App
-    validations:
-      required: true
-  - type: textarea
-    id: description
-    attributes:
-      label: Describe the bug
-      description: Provide a clear and concise description of the challenge you are running into.
-    validations:
-      required: true
-  - type: input
-    id: link
-    attributes:
-      label: Your Example Website or App
-      description: |
-        Which website or app were you using when the bug happened?
-        Note:
-        - Please provide a link via our pre-configured Stackblitz project ([file-based routes](https://stackblitz.com/github/tanstack/router/tree/main/examples/react/quickstart-file-based?file=src%2Fmain.tsx)|[code-based routes](https://stackblitz.com/github/tanstack/router/tree/main/examples/react/quickstart?file=src%2Fmain.tsx)) or a link to a repo that can reproduce the issue.
-        - Your bug will may get fixed much faster if we can run your code and it doesn't have dependencies other than the `router` npm package / dependency.
-        - To create a shareable code example you can use Stackblitz. Please no localhost URLs.
-        - Please read these tips for providing a minimal example: https://stackoverflow.com/help/mcve.
-      placeholder: reproduction URL
-    validations:
-      required: true
-  - type: textarea
-    id: steps
-    attributes:
-      label: Steps to Reproduce the Bug or Issue
-      description: Describe the steps we have to take to reproduce the behavior.
-      placeholder: |
-        1. Go to '...'
-        2. Click on '....'
-        3. Scroll down to '....'
-        4. See error
-    validations:
-      required: true
-  - type: textarea
-    id: expected
-    attributes:
-      label: Expected behavior
-      description: Provide a clear and concise description of what you expected to happen.
-      placeholder: |
-        As a user, I expected ___ behavior but i am seeing ___
-    validations:
-      required: true
-  - type: textarea
-    id: screenshots_or_videos
-    attributes:
-      label: Screenshots or Videos
-      description: |
-        If applicable, add screenshots or a video to help explain your problem.
-        For more information on the supported file image/file types and the file size limits, please refer
-        to the following link: https://docs.github.com/en/github/writing-on-github/working-with-advanced-formatting/attaching-files
-      placeholder: |
-        You can drag your video or image files inside of this editor ↓
-  - type: textarea
-    id: platform
-    attributes:
-      label: Platform
-      value: |
-        - OS: [e.g. macOS, Windows, Linux]
-        - Browser: [e.g. Chrome, Safari, Firefox]
-        - Version: [e.g. 91.1]
-    validations:
-      required: true
-  - type: textarea
-    id: additional
-    attributes:
-      label: Additional context
-      description: Add any other context about the problem here.

package/.github/ISSUE_TEMPLATE/config.yml

@@ -1,11 +0,0 @@
-blank_issues_enabled: false
-contact_links:
-  - name: 🤔 Feature Requests & Questions
-    url: https://github.com/tanstack/create-tsrouter-app/discussions
-    about: Please ask and answer questions here.
-  - name: 💬 Community Chat
-    url: https://discord.gg/mQd7egN
-    about: A dedicated discord server hosted by Tanner Linsley
-  - name: 💬 Tanstack Twitter
-    url: https://twitter.com/tan_stack
-    about: Stay up to date with new releases of our libraries

package/.github/workflows/ci.yml

@@ -1,45 +0,0 @@
-name: ci
-
-on:
-  workflow_dispatch:
-    inputs:
-      tag:
-        description: override release tag
-        required: false
-  push:
-    branches: [main, alpha, beta]
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event.number || github.ref }}
-  cancel-in-progress: true
-
-permissions:
-  contents: write
-  id-token: write
-
-jobs:
-  test-and-publish:
-    name: Test & Publish
-    if: github.repository_owner == 'TanStack'
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4.2.2
-        with:
-          fetch-depth: 0
-      - name: Setup Tools
-        uses: tanstack/config/.github/setup@main
-      - name: Test
-        run: pnpm test
-      - name: Build
-        run: pnpm build
-      - name: Publish
-        run: |
-          git config --global user.name 'Tanner Linsley'
-          git config --global user.email 'tannerlinsley@users.noreply.github.com'
-          npm config set '//registry.npmjs.org/:_authToken' "${NPM_TOKEN}"
-          pnpm run cipublish
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-          TAG: ${{ inputs.tag }}

package/.nvmrc

@@ -1 +0,0 @@
-20.17.0

package/.prettierignore

@@ -1,3 +0,0 @@
-dist
-project-template
-node_modules

package/CONTRIBUTING.md

@@ -1,34 +0,0 @@
-# Contributing
-
-- Clone the repo
-  - `gh repo clone TanStack/create-tsrouter-app`
-- Ensure `node` is installed
-  - https://nodejs.org/en/
-- Ensure `pnpm` is installed
-  - https://pnpm.io/installation
-  - Why? We use `pnpm` to manage workspace dependencies. It's easily the best monorepo/workspace experience available as of when this was written.
-- Install dependencies
-  - `pnpm install`
-  - This installs dependencies for all of the packages in the monorepo, even examples!
-  - Dependencies inside of the packages and examples are automatically linked together as local/dynamic dependencies.
-- Run the build
-  - `pnpm build`
-- Build an example app with the builder
-  - `pnpm start app-js`
-- Run the `app-js` app just to make sure it works
-- Make changes to the code
-  - Re-run `pnpm build` and `pnpm start` (in all its configurations) to make sure the changes work
-- Check your work and PR
-
-# Testing combinations
-
-These must all product running applications that can be built (`pnpm build`) and tested (`pnpm test`).
-
-| Command                                                  | Description                                                        |
-| -------------------------------------------------------- | ------------------------------------------------------------------ |
-| `pnpm start app-js`                                      | Creates a JavaScript app                                           |
-| `pnpm start app-ts --template typescript`                | Creates a TypeScript app                                           |
-| `pnpm start app-js-tw --tailwind`                        | Creates a JavaScript app with Tailwind CSS                         |
-| `pnpm start app-ts-tw --template typescript --tailwind`  | Creates a TypeScript app with Tailwind CSS                         |
-| `pnpm start app-fr --template file-router`               | Creates a TypeScript app with File Based Routing                   |
-| `pnpm start app-fr-tw --template file-router --tailwind` | Creates a TypeScript app with File Based Routing with Tailwind CSS |

package/dist/add-ons.js

@@ -1,69 +0,0 @@
-import { readFile } from 'node:fs/promises';
-import { existsSync, readdirSync, statSync } from 'node:fs';
-import { resolve } from 'node:path';
-import { fileURLToPath } from 'node:url';
-import chalk from 'chalk';
-import { DEFAULT_FRAMEWORK } from './constants.js';
-function isDirectory(path) {
-    return statSync(path).isDirectory();
-}
-export async function getAllAddOns(framework, template) {
-    const addOns = [];
-    for (const type of ['add-on', 'example']) {
-        const addOnsBase = fileURLToPath(new URL(`../templates/${framework}/${type}`, import.meta.url));
-        if (!existsSync(addOnsBase)) {
-            continue;
-        }
-        for (const dir of await readdirSync(addOnsBase).filter((file) => isDirectory(resolve(addOnsBase, file)))) {
-            const filePath = resolve(addOnsBase, dir, 'info.json');
-            const fileContent = await readFile(filePath, 'utf-8');
-            const info = JSON.parse(fileContent);
-            if (!info.templates.includes(template)) {
-                continue;
-            }
-            let packageAdditions = {};
-            if (existsSync(resolve(addOnsBase, dir, 'package.json'))) {
-                packageAdditions = JSON.parse(await readFile(resolve(addOnsBase, dir, 'package.json'), 'utf-8'));
-            }
-            let readme;
-            if (existsSync(resolve(addOnsBase, dir, 'README.md'))) {
-                readme = await readFile(resolve(addOnsBase, dir, 'README.md'), 'utf-8');
-            }
-            addOns.push({
-                ...info,
-                id: dir,
-                type,
-                directory: resolve(addOnsBase, dir),
-                packageAdditions,
-                readme,
-            });
-        }
-    }
-    return addOns;
-}
-// Turn the list of chosen add-on IDs into a final list of add-ons by resolving dependencies
-export async function finalizeAddOns(framework, template, chosenAddOnIDs) {
-    const finalAddOnIDs = new Set(chosenAddOnIDs);
-    const addOns = await getAllAddOns(framework, template);
-    for (const addOnID of finalAddOnIDs) {
-        const addOn = addOns.find((a) => a.id === addOnID);
-        if (!addOn) {
-            throw new Error(`Add-on ${addOnID} not found`);
-        }
-        for (const dependsOn of addOn.dependsOn || []) {
-            const dep = addOns.find((a) => a.id === dependsOn);
-            if (!dep) {
-                throw new Error(`Dependency ${dependsOn} not found`);
-            }
-            finalAddOnIDs.add(dep.id);
-        }
-    }
-    return [...finalAddOnIDs].map((id) => addOns.find((a) => a.id === id));
-}
-export async function listAddOns(options) {
-    const mode = options.template === 'file-router' ? 'file-router' : 'code-router';
-    const addOns = await getAllAddOns(options.framework || DEFAULT_FRAMEWORK, mode);
-    for (const addOn of addOns) {
-        console.log(`${chalk.bold(addOn.id)}: ${addOn.description}`);
-    }
-}

package/dist/cli.js

@@ -1,89 +0,0 @@
-import { Command, InvalidArgumentError } from 'commander';
-import { intro, log } from '@clack/prompts';
-import { createApp } from './create-app.js';
-import { normalizeOptions, promptForOptions } from './options.js';
-import { SUPPORTED_PACKAGE_MANAGERS } from './package-manager.js';
-import { SUPPORTED_TOOLCHAINS } from './toolchain.js';
-import runServer from './mcp.js';
-import { listAddOns } from './add-ons.js';
-import { DEFAULT_FRAMEWORK, SUPPORTED_FRAMEWORKS } from './constants.js';
-import { createDefaultEnvironment } from './environment.js';
-export function cli() {
-    const program = new Command();
-    program
-        .name('create-tsrouter-app')
-        .description('CLI to create a new TanStack application')
-        .argument('[project-name]', 'name of the project')
-        .option('--no-git', 'do not create a git repository')
-        .option('--framework <type>', 'project framework (solid, react)', (value) => {
-        if (!SUPPORTED_FRAMEWORKS.includes(value)) {
-            throw new InvalidArgumentError(`Invalid framework: ${value}. Only the following are allowed: ${SUPPORTED_FRAMEWORKS.join(', ')}`);
-        }
-        return value;
-    }, DEFAULT_FRAMEWORK)
-        .option('--template <type>', 'project template (typescript, javascript, file-router)', (value) => {
-        if (value !== 'typescript' &&
-            value !== 'javascript' &&
-            value !== 'file-router') {
-            throw new InvalidArgumentError(`Invalid template: ${value}. Only the following are allowed: typescript, javascript, file-router`);
-        }
-        return value;
-    })
-        .option(`--package-manager <${SUPPORTED_PACKAGE_MANAGERS.join('|')}>`, `Explicitly tell the CLI to use this package manager`, (value) => {
-        if (!SUPPORTED_PACKAGE_MANAGERS.includes(value)) {
-            throw new InvalidArgumentError(`Invalid package manager: ${value}. The following are allowed: ${SUPPORTED_PACKAGE_MANAGERS.join(', ')}`);
-        }
-        return value;
-    })
-        .option(`--toolchain <${SUPPORTED_TOOLCHAINS.join('|')}>`, `Explicitly tell the CLI to use this toolchain`, (value) => {
-        if (!SUPPORTED_TOOLCHAINS.includes(value)) {
-            throw new InvalidArgumentError(`Invalid toolchain: ${value}. The following are allowed: ${SUPPORTED_TOOLCHAINS.join(', ')}`);
-        }
-        return value;
-    })
-        .option('--tailwind', 'add Tailwind CSS', false)
-        .option('--add-ons [...add-ons]', 'pick from a list of available add-ons (comma separated list)', (value) => {
-        let addOns = !!value;
-        if (typeof value === 'string') {
-            addOns = value.split(',').map((addon) => addon.trim());
-        }
-        return addOns;
-    })
-        .option('--list-add-ons', 'list all available add-ons', false)
-        .option('--mcp', 'run the MCP server', false)
-        .option('--mcp-sse', 'run the MCP server in SSE mode', false)
-        .action(async (projectName, options) => {
-        if (options.listAddOns) {
-            await listAddOns(options);
-        }
-        else if (options.mcp || options.mcpSse) {
-            await runServer(!!options.mcpSse);
-        }
-        else {
-            try {
-                const cliOptions = {
-                    projectName,
-                    ...options,
-                };
-                let finalOptions = await normalizeOptions(cliOptions);
-                if (finalOptions) {
-                    intro(`Creating a new TanStack app in ${projectName}...`);
-                }
-                else {
-                    intro("Let's configure your TanStack application");
-                    finalOptions = await promptForOptions(cliOptions);
-                }
-                await createApp(finalOptions, {
-                    environment: createDefaultEnvironment(),
-                });
-            }
-            catch (error) {
-                log.error(error instanceof Error
-                    ? error.message
-                    : 'An unknown error occurred');
-                process.exit(1);
-            }
-        }
-    });
-    program.parse();
-}

package/dist/constants.js

@@ -1,4 +0,0 @@
-export const CODE_ROUTER = 'code-router';
-export const FILE_ROUTER = 'file-router';
-export const SUPPORTED_FRAMEWORKS = ['solid', 'react'];
-export const DEFAULT_FRAMEWORK = 'react';