create-tsrouter-app 0.0.4

package/project-template/src/App.tsx.ejs

@@ -0,0 +1,64 @@
+import logo from "./logo.svg";
+<% if (!tailwind) { %>
+import "./App.css";
+<% } %>
+
+function App() {
+  return (<% if (tailwind) { %>
+    <div className="text-center">
+      <header className="min-h-screen flex flex-col items-center justify-center bg-[#282c34] text-white text-[calc(10px+2vmin)]">
+        <img
+          src={logo}
+          className="h-[40vmin] pointer-events-none animate-[spin_20s_linear_infinite]"
+          alt="logo"
+        />
+        <p>
+          Edit <code>src/App.<%= jsx %></code> and save to reload.
+        </p>
+        <a
+          className="text-[#61dafb] hover:underline"
+          href="https://reactjs.org"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn React
+        </a>
+        <a
+          className="text-[#61dafb] hover:underline"
+          href="https://tanstack.com"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn TanStack
+        </a>
+      </header>
+    </div>
+<% } else { %>
+    <div className="App">
+      <header className="App-header">
+        <img src={logo} className="App-logo" alt="logo" />
+        <p>
+          Edit <code>src/App.<%= jsx %></code> and save to reload.
+        </p>
+        <a
+          className="App-link"
+          href="https://reactjs.org"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn React
+        </a>
+        <a
+          className="App-link"
+          href="https://tanstack.com"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn TanStack
+        </a>
+      </header>
+    </div>
+<% } %>  );
+}
+
+export default App;

package/project-template/src/logo.svg

@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 841.9 595.3">
+  <!-- Generator: Adobe Illustrator 29.3.0, SVG Export Plug-In . SVG Version: 2.1.0 Build 146)  -->
+  <defs>
+    <style>
+      .st0 {
+        fill: #9ae7fc;
+      }
+
+      .st1 {
+        fill: #61dafb;
+      }
+
+      .st2 {
+        fill: #61dafb;
+      }
+    </style>
+  </defs>
+  <circle class="st0" cx="420.7" cy="297.3" r="51"/>
+  <path class="st2" d="M474.4,297.3c0,29.6-24,53.6-53.6,53.6s-53.6-24-53.6-53.6,24-53.6,53.6-53.6,53.6,24,53.6,53.6ZM379.5,296.1v-7.5c0-1.3,1.4-6.1,2.1-7.4,1.2-2.3,3.4-4.1,5.4-5.6l-4-4c4.7-4.3,11.1-4.4,16.2-.8,2.3-5.6,7.8-8.4,13.8-8l-1,5c7,.2,15.5,4.9,15.5,12.8s0,.6-.8.8c-2,.3-4-.5-5.9-.7s-1.4-.5-1.4.4,3,4.9,3.5,6.5,1.2,4.1,1,6.3c-6.6-1-12.4-3.8-17.5-8,.3,3.1,4.9,25.7,6.3,26s1-.7,1.2-1.3,1.5-7.5,1.5-8c0-1.2-2-2.1-2.6-3.3-1.4-3.2,1.5-5.6,4.4-3.9s6.2,7.4,8.9,8.6,15.4,1.7,17.6,3.9-3.4,5.4-1.8,9c8-3.1,16-3.9,24.4-3,3.7-11.5,3.7-24.1-1.1-35.3-8.6,0-17.4-4.3-20.4-12.8s-.8-10.2-1.5-11c-1-1.2-7.5.7-8.8-1.8s.3-1.3-.2-1.7-2.3-.7-3.1-.9c-30.8-7.6-60.8,18.6-58.9,49.9.1,1.9,1.9,12.2,2.8,13.2s5.7,0,7.5,0,4.4.4,5.9.6c3.4.5,8.5,2.9,11.1,3s2.9-1,3.2-2.8c.5-3.1.6-8.8.6-12s-1.2-9.3-1.5-13.7c-1.1-.2-.8,0-1.1.6-.8,1.6-1.3,3.8-2.3,5.7s-6.2,10.3-6.8,10.7-.8-.6-1-1c-1.9-4.2-2.4-9.4-2.3-14-1.1-1.2-6.4,5.8-8,6.3l-1-.5ZM462,273.3c1.3-1.4-7.1-10.5-8.5-11.8-3.6-3.2-6.4-5.3-4.2,1.7s6.8,9.2,12.6,10.1ZM409,265.8c-.5-.6-7.2,3.4-6.5,5.5,2.2-1.6,7-2,6.5-5.5ZM396.5,273.3c-.3-2.9-7.5-3.2-8.5-1.2s1.9,1.7,2.3,1.7c2.1.4,4.1-.7,6.2-.5ZM409.5,273.8c4.5,1.6,7.8,4.3,12.9,4.4s-.1-3.6-1.4-4.6c-2.6-2-6-2.9-9.2-2.8s-1.9-.4-1.7.5c3.3.7,8.6.8,10,4.5-2.7-.3-4.6-1.9-7.4-2.4s-3-.6-3.1.4ZM420.5,289.8c-1-6-6.8-12.8-12.9-13.8s-1.6-.5-1,.6,5.6,3.8,6.7,4.8,5.3,5,2.5,4.5-10-9.2-11.2-8c.2,1.1,1.3,2.3,2,3.2,3.5,4.5,8.2,8.1,14,8.8ZM390.5,277.3c-5.9,1.3-8.2,7.5-8,13,.8.9,5.9-4.5,6.4-5.3s3.2-5.4,1.3-4.7-3.4,5.2-5,5.5.2-2.5.5-3c1.3-1.9,3.4-3.7,4.7-5.5ZM396.5,279.3c-.5-.6-2.4,1.6-2.7,2-3.4,4.6-3.1,12.1-1.8,17.5.9.2,1-.3,1.4-.8,3.5-4.5,6.5-12.5,5.3-18.2-2.5,3.7-3.7,8.6-4.3,13h-1.5c0-4.8,2.2-9.1,3.5-13.5ZM428,308.3c.1-2-2-1.7-3-2.3s-1.6-2.2-3.5-1.7c1.6,2.5,3.5,3.8,6.5,4ZM416.5,311.3c9,.8,6.5-2.3,1.7-6.5-1.6-.4-1.8,5.3-1.7,6.5ZM440,312.8c-4.1-.4-9.3-2.4-13.3-2.5s-1.6,0-2.2.8c4.8,1.5,9.9,2,14.3,4.7l1.2-3ZM420.4,316.4c-8.7.1-17.9,4.4-24.2,10.4s-5.7,6.3-5.7,7.3c0,2.1,10.2,7.3,12.4,8.1,14.3,5.7,32.6,4.1,45.3-5s3.7-3.2.1-7.4c-6.7-7.8-17.4-13.5-27.8-13.4ZM394.5,321.3c-1.7-1.7-5.9-2.3-8.3-2.5s-6.3-.4-8.2.7l16.5,1.7ZM463.5,318.8h-8.8c-1.1,0-5.8,1.3-7.1,1.9s-1,.7.1.6c2.8-.1,6.1-1.2,9-1.5s4.1.2,6,0,1.6-.4.7-1Z"/>
+  <path class="st0" d="M379.5,296.1l1,.5c1.6-.4,6.9-7.4,8-6.3-.1,4.6.4,9.8,2.3,14s.1,1.4,1,1,6.1-9.3,6.8-10.7,1.5-4.1,2.3-5.7,0-.8,1.1-.6c.3,4.5,1.4,9.3,1.5,13.7s0,8.9-.6,12-1.3,2.9-3.2,2.8-7.7-2.5-11.1-3-4.4-.6-5.9-.6-6.4,1.3-7.5,0-2.6-11.3-2.8-13.2c-1.8-31.3,28.1-57.5,58.9-49.9s2.6.5,3.1.9,0,1.2.2,1.7c1.3,2.4,7.7.6,8.8,1.8s.5,8.2,1.5,11c3,8.5,11.8,12.9,20.4,12.8,4.7,11.2,4.8,23.8,1.1,35.3-8.5-.8-16.5,0-24.4,3-1.6-3.7,4.9-6,1.8-9s-14-2.2-17.6-3.9-6.4-7.2-8.9-8.6-5.8.7-4.4,3.9,2.5,2.1,2.6,3.3-1.2,7.3-1.5,8-.3,1.5-1.2,1.3c-1.3-.3-5.9-22.9-6.3-26,5.1,4.2,10.9,7,17.5,8,.2-2.2-.3-4.2-1-6.3s-3.5-6.1-3.5-6.5c0-.9,1.1-.4,1.4-.4,1.9.1,3.9,1,5.9.7s.8.3.8-.8c0-7.8-8.5-12.6-15.5-12.8l1-5c-6-.4-11.4,2.4-13.8,8-5.1-3.6-11.6-3.5-16.2.8l4,4c-2.1,1.5-4.2,3.3-5.4,5.6s-2.1,6.1-2.1,7.4v7.5ZM433.5,259.8c9.3,2.5,10.3-4.1.2-1.5l-.2,1.5ZM434.5,266.8c.4.7,7.6-.5,6.9-2.7s-5.4.7-6.7.7l-.2,2ZM437,272.8c1,1.4,6.7-2.1,6.5-3.2-.5-2.2-7.8,1.4-6.5,3.2ZM447,273.3c-1.1-1.1-5.9,3.3-5.5,4.7.7,2.8,6.8-3.5,5.5-4.7ZM449.6,277.4c-.3.2-3.7,5.4-1.8,5.9s4.1-4,4.2-4.8-1.6-1.5-2.4-1.1ZM454,286.3c2.5.9,4.5-6,2.7-6.5-2.2-.7-3.1,6.1-2.7,6.5ZM464,287.8c.6-2,1.3-5.6-1.2-6.5-1.2.3-.7,4.6-.7,5.7l.4.6,1.5.2Z"/>
+  <path class="st0" d="M462,273.3c-5.9-.9-10.8-4.3-12.6-10.1s.6-4.8,4.2-1.7,9.8,10.3,8.5,11.8Z"/>
+  <path class="st0" d="M420.5,289.8c-5.8-.7-10.5-4.3-14-8.8s-1.8-2.1-2-3.2c1.2-1.2,10.1,7.8,11.2,8,2.8.5-2.1-4.2-2.5-4.5-1.2-1-6.4-4.2-6.7-4.8-.5-1,.6-.6,1-.6,6.2,1,12,7.8,12.9,13.8Z"/>
+  <path class="st0" d="M396.5,279.3c-1.3,4.4-3.6,8.7-3.5,13.5h1.5c.6-4.4,1.8-9.3,4.3-13,1.2,5.7-1.8,13.7-5.3,18.2s-.5,1-1.4.8c-1.3-5.3-1.6-12.8,1.8-17.5s2.2-2.6,2.7-2Z"/>
+  <path class="st0" d="M409.5,273.8c.1-1,2.5-.5,3.1-.4,2.8.5,4.7,2,7.4,2.4-1.4-3.7-6.7-3.8-10-4.5-.1-.9,1.1-.5,1.7-.5,3.3,0,6.6.8,9.2,2.8s4.8,4.7,1.4,4.6c-5.1-.1-8.4-2.8-12.9-4.4Z"/>
+  <path class="st0" d="M390.5,277.3c-1.3,1.9-3.5,3.6-4.7,5.5s-2.3,3.3-.5,3,3.3-4.8,5-5.5-1.1,4.3-1.3,4.7c-.5.8-5.6,6.2-6.4,5.3-.2-5.5,2.1-11.7,8-13Z"/>
+  <path class="st0" d="M440,312.8l-1.2,3c-4.3-2.7-9.5-3.3-14.3-4.7.6-.8,1.3-.8,2.2-.8,4,.1,9.2,2.1,13.3,2.5Z"/>
+  <path class="st0" d="M416.5,311.3c0-1.2.1-6.9,1.7-6.5,4.7,4.2,7.2,7.3-1.7,6.5Z"/>
+  <path class="st0" d="M396.5,273.3c-2.1-.3-4.1.8-6.2.5s-2.7-1-2.3-1.7c1-1.9,8.2-1.7,8.5,1.2Z"/>
+  <path class="st0" d="M409,265.8c.5,3.5-4.3,3.9-6.5,5.5-.7-2.1,5.9-6.1,6.5-5.5Z"/>
+  <path class="st0" d="M428,308.3c-3-.2-4.9-1.5-6.5-4,2-.5,2.4,1,3.5,1.7s3.1.3,3,2.3Z"/>
+  <path class="st2" d="M434.5,266.8l.2-2c1.3,0,6.1-2.6,6.7-.7s-6.5,3.4-6.9,2.7Z"/>
+  <path class="st2" d="M433.5,259.8l.2-1.5c10-2.5,9.1,4-.2,1.5Z"/>
+  <path class="st2" d="M437,272.8c-1.3-1.8,6-5.5,6.5-3.2s-5.5,4.7-6.5,3.2Z"/>
+  <path class="st2" d="M447,273.3c1.3,1.3-4.7,7.6-5.5,4.7s4.4-5.8,5.5-4.7Z"/>
+  <path class="st2" d="M449.6,277.4c.8-.5,2.5,0,2.4,1.1s-2.8,5.2-4.2,4.8,1.5-5.7,1.8-5.9Z"/>
+  <path class="st2" d="M454,286.3c-.4-.4.5-7.2,2.7-6.5,1.7.5-.2,7.4-2.7,6.5Z"/>
+  <path class="st2" d="M464,287.8l-1.5-.2-.4-.6c0-1.1-.5-5.4.7-5.7,2.5.9,1.8,4.5,1.2,6.5Z"/>
+  <path class="st0" d="M420.4,316.4c10.5-.1,21.2,5.6,27.8,13.4s4.5,4.1-.1,7.4c-12.7,9.1-30.9,10.7-45.3,5-2.2-.9-12.4-6-12.4-8.1s4.7-6.3,5.7-7.3c6.3-5.9,15.5-10.2,24.2-10.4Z"/>
+  <path class="st0" d="M394.5,321.3l-16.5-1.7c2-1.2,5.9-.9,8.2-.7s6.6.8,8.3,2.5Z"/>
+  <path class="st0" d="M463.5,318.8c.8.6,0,.9-.7,1-1.9.2-4.1-.2-6,0-2.9.3-6.2,1.4-9,1.5s-1.3-.1-.1-.6,6-1.9,7.1-1.9h8.8Z"/>
+  <path class="st2" d="M666.3,296.5c0-32.5-40.7-63.3-103.1-82.4,14.4-63.6,8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6,0,8.3.9,11.4,2.6,13.6,7.8,19.5,37.5,14.9,75.7-1.1,9.4-2.9,19.3-5.1,29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50,32.6-30.3,63.2-46.9,84-46.9v-22.3c-27.5,0-63.5,19.6-99.9,53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7,0,51.4,16.5,84,46.6-14,14.7-28,31.4-41.3,49.9-22.6,2.4-44,6.1-63.6,11-2.3-10-4-19.7-5.2-29-4.7-38.2,1.1-67.9,14.6-75.8,3-1.8,6.9-2.6,11.5-2.6v-22.3c-8.4,0-16,1.8-22.6,5.6-28.1,16.2-34.4,66.7-19.9,130.1-62.2,19.2-102.7,49.9-102.7,82.3s40.7,63.3,103.1,82.4c-14.4,63.6-8,114.2,20.2,130.4,6.5,3.8,14.1,5.6,22.5,5.6,27.5,0,63.5-19.6,99.9-53.6,36.4,33.8,72.4,53.2,99.9,53.2s16-1.8,22.6-5.6c28.1-16.2,34.4-66.7,19.9-130.1,62-19.1,102.5-49.9,102.5-82.3h0ZM536.1,229.8c-3.7,12.9-8.3,26.2-13.5,39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4,14.2,2.1,27.9,4.7,41,7.9h0ZM490.3,336.3c-7.8,13.5-15.8,26.3-24.1,38.2-14.9,1.3-30,2-45.2,2s-30.2-.7-45-1.9c-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8,6.2-13.4,13.2-26.8,20.7-39.9,7.8-13.5,15.8-26.3,24.1-38.2,14.9-1.3,30-2,45.2-2s30.2.7,45,1.9c8.3,11.9,16.4,24.6,24.2,38,7.6,13.1,14.5,26.4,20.8,39.8-6.3,13.4-13.2,26.8-20.7,39.9h0ZM522.6,323.3c5.4,13.4,10,26.8,13.8,39.8-13.1,3.2-26.9,5.9-41.2,8,4.9-7.7,9.8-15.6,14.4-23.7,4.6-8,8.9-16.1,13-24.1h0ZM421.2,430c-9.3-9.6-18.6-20.3-27.8-32,9,.4,18.2.7,27.5.7s18.7-.2,27.8-.7c-9,11.7-18.3,22.4-27.5,32ZM346.8,371.1c-14.2-2.1-27.9-4.7-41-7.9,3.7-12.9,8.3-26.2,13.5-39.5,4.1,8,8.4,16,13.1,24s9.5,15.8,14.4,23.4ZM420.7,163c9.3,9.6,18.6,20.3,27.8,32-9-.4-18.2-.7-27.5-.7s-18.7.2-27.8.7c9-11.7,18.3-22.4,27.5-32ZM346.7,221.9c-4.9,7.7-9.8,15.6-14.4,23.7-4.6,8-8.9,16-13,24-5.4-13.4-10-26.8-13.8-39.8,13.1-3.1,26.9-5.8,41.2-7.9h0ZM256.2,347.1c-35.4-15.1-58.3-34.9-58.3-50.6s22.9-35.6,58.3-50.6c8.6-3.7,18-7,27.7-10.1,5.7,19.6,13.2,40,22.5,60.9-9.2,20.8-16.6,41.1-22.2,60.6-9.9-3.1-19.3-6.5-28-10.2h0ZM310,490c-13.6-7.8-19.5-37.5-14.9-75.7,1.1-9.4,2.9-19.3,5.1-29.4,19.6,4.8,41,8.5,63.5,10.9,13.5,18.5,27.5,35.3,41.6,50-32.6,30.3-63.2,46.9-84,46.9-4.5-.1-8.3-1-11.3-2.7h0ZM547.2,413.8c4.7,38.2-1.1,67.9-14.6,75.8-3,1.8-6.9,2.6-11.5,2.6-20.7,0-51.4-16.5-84-46.6,14-14.7,28-31.4,41.3-49.9,22.6-2.4,44-6.1,63.6-11,2.3,10.1,4.1,19.8,5.2,29.1ZM585.7,347.1c-8.6,3.7-18,7-27.7,10.1-5.7-19.6-13.2-40-22.5-60.9,9.2-20.8,16.6-41.1,22.2-60.6,9.9,3.1,19.3,6.5,28.1,10.2,35.4,15.1,58.3,34.9,58.3,50.6,0,15.7-23,35.6-58.4,50.6h0Z"/>
+  <path class="st1" d="M520.5,78.1"/>
+</svg>

package/project-template/src/main.tsx.ejs

@@ -0,0 +1,61 @@
+import { StrictMode } from "react";
+import ReactDOM from "react-dom/client";
+import {
+  Outlet,
+  RouterProvider,
+  createRootRoute,
+  createRoute,
+  createRouter,
+} from "@tanstack/react-router";
+import { TanStackRouterDevtools } from "@tanstack/router-devtools";
+
+import "./styles.css";
+import reportWebVitals from "./reportWebVitals";
+
+import App from "./App";
+
+const rootRoute = createRootRoute({
+  component: () => (
+    <>
+      <Outlet />
+      <TanStackRouterDevtools />
+    </>
+  ),
+});
+
+const indexRoute = createRoute({
+  getParentRoute: () => rootRoute,
+  path: "/",
+  component: App,
+});
+
+const routeTree = rootRoute.addChildren([indexRoute]);
+
+const router = createRouter({
+  routeTree,
+  defaultPreload: "intent",
+  scrollRestoration: true,
+});
+<% if (typescript) { %>
+declare module "@tanstack/react-router" {
+  interface Register {
+    router: typeof router;
+  }
+}
+
+const rootElement = document.getElementById("app")!;
+<% } else { %>
+const rootElement = document.getElementById("app");
+<% } %>if (!rootElement.innerHTML) {
+  const root = ReactDOM.createRoot(rootElement);
+  root.render(
+    <StrictMode>
+      <RouterProvider router={router} />
+    </StrictMode>
+  );
+}
+
+// If you want to start measuring performance in your app, pass a function
+// to log results (for example: reportWebVitals(console.log))
+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
+reportWebVitals();

package/project-template/src/reportWebVitals.ts.ejs

@@ -0,0 +1,28 @@
+<% if (typescript) { %>
+const reportWebVitals = (onPerfEntry?: () => void) => {
+  if (onPerfEntry && onPerfEntry instanceof Function) {
+    import("web-vitals").then(
+      ({ getCLS, getFID, getFCP, getLCP, getTTFB }: any) => {
+        getCLS(onPerfEntry);
+        getFID(onPerfEntry);
+        getFCP(onPerfEntry);
+        getLCP(onPerfEntry);
+        getTTFB(onPerfEntry);
+      }
+    );
+  }
+};
+<% } else { %>  
+const reportWebVitals = onPerfEntry => {
+  if (onPerfEntry && onPerfEntry instanceof Function) {
+    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+      getCLS(onPerfEntry);
+      getFID(onPerfEntry);
+      getFCP(onPerfEntry);
+      getLCP(onPerfEntry);
+      getTTFB(onPerfEntry);
+    });
+  }
+};
+<% } %>
+export default reportWebVitals;

package/project-template/src/styles.css.ejs

@@ -0,0 +1,15 @@
+<% if (tailwind) { %>@import "tailwindcss";
+<% } %>
+body {
+  <% if (tailwind) { %>@apply m-0;<% } else { %>margin: 0;<% } %>
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
+    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
+    monospace;
+}

package/project-template/tsconfig.dev.json

@@ -0,0 +1,10 @@
+{
+  "composite": true,
+  "extends": "../../../tsconfig.base.json",
+
+  "files": ["src/main.tsx"],
+  "include": [
+    "src"
+    // "__tests__/**/*.test.*"
+  ]
+}

package/project-template/tsconfig.json

@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "strict": true,
+    "types": ["vite/client", "node"],
+    "esModuleInterop": true,
+    "jsx": "react-jsx",
+    "lib": ["DOM", "DOM.Iterable", "ES2022"],
+    "skipLibCheck": true
+  }
+}

package/project-template/vite.config.js.ejs

@@ -0,0 +1,14 @@
+import { defineConfig } from "vite";
+import viteReact from "@vitejs/plugin-react";
+<% if (tailwind) { %>
+import tailwindcss from "@tailwindcss/vite";
+<% } %>
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [viteReact()<% if (tailwind) { %>, tailwindcss()<% } %>],
+  test: {
+    globals: true,
+    environment: "jsdom",
+  },
+});

package/scripts/publish.js

@@ -0,0 +1,33 @@
+// @ts-check
+
+import { resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { publish } from '@tanstack/config/publish'
+
+const __dirname = fileURLToPath(new URL('.', import.meta.url))
+
+await publish({
+  packages: [
+    {
+      name: 'create-tsrouter-app',
+      packageDir: '.',
+    },
+  ],
+  branchConfigs: {
+    main: {
+      prerelease: false,
+    },
+    alpha: {
+      prerelease: true,
+    },
+    beta: {
+      prerelease: true,
+    },
+  },
+  rootDir: resolve(__dirname, '..'),
+  branch: process.env.BRANCH,
+  tag: process.env.TAG,
+  ghToken: process.env.GH_TOKEN,
+})
+
+process.exit(0)

package/src/index.ts

@@ -0,0 +1,248 @@
+#!/usr/bin/env node
+
+import { copyFile, mkdir, readFile, writeFile } from 'node:fs/promises'
+import { resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { Command, InvalidArgumentError } from 'commander'
+import { intro, outro, spinner } from '@clack/prompts'
+import { execa } from 'execa'
+import { render } from 'ejs'
+
+import {
+  SUPPORTED_PACKAGE_MANAGERS,
+  getPackageManager,
+} from './utils/getPackageManager.js'
+
+import type { PackageManager } from './utils/getPackageManager.js'
+
+const program = new Command()
+
+interface Options {
+  typescript: boolean
+  tailwind: boolean
+  packageManager: PackageManager
+}
+
+const createCopyFile = (templateDir: string, targetDir: string) =>
+  async function copyFiles(files: Array<string>) {
+    for (const file of files) {
+      const targetFileName = file.replace('.tw', '')
+      await copyFile(
+        resolve(templateDir, file),
+        resolve(targetDir, targetFileName),
+      )
+    }
+  }
+
+const createTemplateFile = (
+  projectName: string,
+  options: Required<Options>,
+  templateDir: string,
+  targetDir: string,
+) =>
+  async function templateFile(file: string, targetFileName?: string) {
+    const templateValues = {
+      packageManager: options.packageManager,
+      projectName: projectName,
+      typescript: options.typescript,
+      tailwind: options.tailwind,
+      js: options.typescript ? 'ts' : 'js',
+      jsx: options.typescript ? 'tsx' : 'jsx',
+    }
+
+    const template = await readFile(resolve(templateDir, file), 'utf-8')
+    const content = render(template, templateValues)
+    const target = targetFileName ?? file.replace('.ejs', '')
+    await writeFile(resolve(targetDir, target), content)
+  }
+
+async function createPackageJSON(
+  projectName: string,
+  options: Required<Options>,
+  templateDir: string,
+  targetDir: string,
+) {
+  let packageJSON = JSON.parse(
+    await readFile(resolve(templateDir, 'package.json'), 'utf8'),
+  )
+  packageJSON.name = projectName
+  if (options.typescript) {
+    const tsPackageJSON = JSON.parse(
+      await readFile(resolve(templateDir, 'package.ts.json'), 'utf8'),
+    )
+    packageJSON = {
+      ...packageJSON,
+      devDependencies: {
+        ...packageJSON.devDependencies,
+        ...tsPackageJSON.devDependencies,
+      },
+    }
+  }
+  if (options.tailwind) {
+    const twPackageJSON = JSON.parse(
+      await readFile(resolve(templateDir, 'package.tw.json'), 'utf8'),
+    )
+    packageJSON = {
+      ...packageJSON,
+      dependencies: {
+        ...packageJSON.dependencies,
+        ...twPackageJSON.dependencies,
+      },
+    }
+  }
+  await writeFile(
+    resolve(targetDir, 'package.json'),
+    JSON.stringify(packageJSON, null, 2),
+  )
+}
+
+async function createApp(projectName: string, options: Required<Options>) {
+  const templateDir = fileURLToPath(
+    new URL('../project-template', import.meta.url),
+  )
+  const targetDir = resolve(process.cwd(), projectName)
+
+  const copyFiles = createCopyFile(templateDir, targetDir)
+  const templateFile = createTemplateFile(
+    projectName,
+    options,
+    templateDir,
+    targetDir,
+  )
+
+  intro(`Creating a new TanStack app in ${targetDir}...`)
+
+  // Make the root directory
+  await mkdir(targetDir, { recursive: true })
+
+  // Setup the .vscode directory
+  await mkdir(resolve(targetDir, '.vscode'), { recursive: true })
+  await copyFile(
+    resolve(templateDir, '.vscode/settings.json'),
+    resolve(targetDir, '.vscode/settings.json'),
+  )
+
+  // Fill the public directory
+  await mkdir(resolve(targetDir, 'public'), { recursive: true })
+  copyFiles([
+    './public/robots.txt',
+    './public/favicon.ico',
+    './public/manifest.json',
+    './public/logo192.png',
+    './public/logo512.png',
+  ])
+
+  // Make the src directory
+  await mkdir(resolve(targetDir, 'src'), { recursive: true })
+
+  // Copy in Vite and Tailwind config and CSS
+  if (!options.tailwind) {
+    await copyFiles(['./src/App.css'])
+  }
+  await templateFile('./vite.config.js.ejs')
+  await templateFile('./src/styles.css.ejs')
+
+  copyFiles(['./src/logo.svg'])
+
+  // Setup the app component. There are four variations, typescript/javascript and tailwind/non-tailwind.
+  await templateFile(
+    './src/App.tsx.ejs',
+    options.typescript ? undefined : './src/App.jsx',
+  )
+  await templateFile(
+    './src/App.test.tsx.ejs',
+    options.typescript ? undefined : './src/App.test.jsx',
+  )
+
+  // Setup the main, reportWebVitals and index.html files
+  if (options.typescript) {
+    await templateFile('./src/main.tsx.ejs')
+    await templateFile('./src/reportWebVitals.ts.ejs')
+  } else {
+    await templateFile('./src/main.tsx.ejs', './src/main.jsx')
+    await templateFile(
+      './src/reportWebVitals.ts.ejs',
+      './src/reportWebVitals.js',
+    )
+  }
+  await templateFile('./index.html.ejs')
+
+  // Setup tsconfig
+  if (options.typescript) {
+    await copyFiles(['./tsconfig.json', './tsconfig.dev.json'])
+  }
+
+  // Setup the package.json file, optionally with typescript and tailwind
+  await createPackageJSON(projectName, options, templateDir, targetDir)
+
+  // Add .gitignore
+  await copyFile(
+    resolve(templateDir, 'gitignore'),
+    resolve(targetDir, '.gitignore'),
+  )
+
+  // Create the README.md
+  await templateFile('README.md.ejs')
+
+  // Install dependencies
+  const s = spinner()
+  s.start(`Installing dependencies via ${options.packageManager}...`)
+  await execa(options.packageManager, ['install'], { cwd: targetDir })
+  s.stop(`Installed dependencies`)
+
+  outro(`Created your new TanStack app in ${targetDir}.`)
+}
+
+program
+  .name('create-tsrouter-app')
+  .description('CLI to create a new TanStack application')
+  .argument('<project-name>', 'name of the project')
+  .option<'typescript' | 'javascript'>(
+    '--template <type>',
+    'project template (typescript/javascript)',
+    (value) => {
+      if (value !== 'typescript' && value !== 'javascript') {
+        throw new InvalidArgumentError(
+          `Invalid template: ${value}. Only the following are allowed: typescript, javascript`,
+        )
+      }
+      return value
+    },
+    'javascript',
+  )
+  .option<PackageManager>(
+    `--package-manager <${SUPPORTED_PACKAGE_MANAGERS.join('|')}>`,
+    `Explicitly tell the CLI to use this package manager`,
+    (value) => {
+      if (!SUPPORTED_PACKAGE_MANAGERS.includes(value as PackageManager)) {
+        throw new InvalidArgumentError(
+          `Invalid package manager: ${value}. Only the following are allowed: ${SUPPORTED_PACKAGE_MANAGERS.join(
+            ', ',
+          )}`,
+        )
+      }
+      return value as PackageManager
+    },
+    getPackageManager(),
+  )
+  .option('--tailwind', 'add Tailwind CSS', false)
+  .action(
+    (
+      projectName: string,
+      options: {
+        template: string
+        tailwind: boolean
+        packageManager: PackageManager
+      },
+    ) => {
+      const typescript = options.template === 'typescript'
+
+      createApp(projectName, {
+        typescript,
+        tailwind: options.tailwind,
+        packageManager: options.packageManager,
+      })
+    },
+  )
+
+program.parse()

package/src/utils/getPackageManager.ts

@@ -0,0 +1,22 @@
+export const SUPPORTED_PACKAGE_MANAGERS = [
+  'npm',
+  'yarn',
+  'pnpm',
+  'bun',
+] as const
+export type PackageManager = (typeof SUPPORTED_PACKAGE_MANAGERS)[number]
+export const DEFAULT_PACKAGE_MANAGER: PackageManager = 'npm'
+
+export function getPackageManager(): PackageManager | undefined {
+  const userAgent = process.env.npm_config_user_agent
+
+  if (userAgent === undefined) {
+    return DEFAULT_PACKAGE_MANAGER
+  }
+
+  const packageManager = SUPPORTED_PACKAGE_MANAGERS.find((manager) =>
+    userAgent.startsWith(manager),
+  )
+
+  return packageManager || DEFAULT_PACKAGE_MANAGER
+}

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"]
+}