chore: last of the base changes

jherr · jherr · commit 933cdc0fd098 · 2025-04-13T18:43:09.000-07:00
diff --git a/packages/cta-engine/src/create-app.ts b/packages/cta-engine/src/create-app.ts
@@ -88,9 +88,7 @@ export async function createApp(
     )
   }
 
-  if (!options.tailwind) {
-    await copyFiles(templateDirBase, ['./src/App.css'])
-  }
+  await templateFile(templateDirBase, './src/App.css.ejs')
 
   await templateFile(templateDirBase, './vite.config.js.ejs')
   await templateFile(templateDirBase, './src/styles.css.ejs')
@@ -148,8 +146,9 @@ export async function createApp(
     options.chosenAddOns.map((addOn) => addOn.packageAdditions),
   )
 
-  // Setup the add-ons
+  const s = silent ? null : environment.spinner()
 
+  // Setup the add-ons
   const isAddOnEnabled = (id: string) =>
     options.chosenAddOns.find((a) => a.id === id)
 
@@ -182,7 +181,6 @@ export async function createApp(
   }
 
   // Copy all the asset files from the addons
-  const s = silent ? null : environment.spinner()
   for (const type of ['add-on', 'example']) {
     for (const phase of ['setup', 'add-on', 'example']) {
       for (const addOn of options.chosenAddOns.filter(
@@ -195,6 +193,14 @@ export async function createApp(
     }
   }
 
+  // Adding starter
+  if (options.starter) {
+    s?.start(`Setting up starter ${options.starter.name}...`)
+    await runAddOn(options.starter)
+    s?.stop(`Starter ${options.starter.name} setup complete`)
+  }
+
+  // Run all the commands
   if (isAddOnEnabled('shadcn')) {
     const shadcnComponents = new Set<string>()
     for (const addOn of options.chosenAddOns) {
@@ -234,13 +240,6 @@ export async function createApp(
     }
   }
 
-  // Adding starter
-  if (options.starter) {
-    s?.start(`Setting up starter ${options.starter.name}...`)
-    await runAddOn(options.starter)
-    s?.stop(`Starter ${options.starter.name} setup complete`)
-  }
-
   // Install dependencies
   s?.start(`Installing dependencies via ${options.packageManager}...`)
   await environment.execute(
diff --git a/templates/react-cra/project/base/src/App.css.ejs b/templates/react-cra/project/base/src/App.css.ejs
@@ -1,4 +1,4 @@
-.App {
+<% if (tailwind) { ignoreFile() } %>.App {
   text-align: center;
 }
 
diff --git a/templates/solid/project/base/src/App.css b/templates/solid/project/base/src/App.css
diff --git a/templates/solid/project/base/src/App.css.ejs b/templates/solid/project/base/src/App.css.ejs
@@ -0,0 +1,38 @@
+<% if (tailwind) { ignoreFile() } %>.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
diff --git a/tests/integration-tests/snapshots/solid/solid-cr-js-npm.json b/tests/integration-tests/snapshots/solid/solid-cr-js-npm.json
@@ -5,7 +5,7 @@
     "/.vscode/settings.json": "{\n  \"files.watcherExclude\": {\n    \"**/routeTree.gen.ts\": true\n  },\n  \"search.exclude\": {\n    \"**/routeTree.gen.ts\": true\n  },\n  \"files.readonlyInclude\": {\n    \"**/routeTree.gen.ts\": true\n  }\n}\n",
     "/public/manifest.json": "{\n  \"short_name\": \"TanStack App\",\n  \"name\": \"Create TanStack App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"64x64 32x32 24x24 16x16\",\n      \"type\": \"image/x-icon\"\n    },\n    {\n      \"src\": \"logo192.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"192x192\"\n    },\n    {\n      \"src\": \"logo512.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"512x512\"\n    }\n  ],\n  \"start_url\": \".\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n",
     "/public/robots.txt": "# https://www.robotstxt.org/robotstxt.html\nUser-agent: *\nDisallow:\n",
-    "/src/App.css": "",
+    "/src/App.css": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  height: 40vmin;\n  pointer-events: none;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .App-logo {\n    animation: App-logo-spin infinite 20s linear;\n  }\n}\n\n.App-header {\n  background-color: #282c34;\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  font-size: calc(10px + 2vmin);\n  color: white;\n}\n\n.App-link {\n  color: #61dafb;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}",
     "/src/App.jsx": "import logo from './logo.svg'\n\nfunction App() {\n  return (\n    <main class=\"min-h-screen flex flex-col items-center justify-center bg-[#282c34] text-white text-[calc(10px+2vmin)] text-center\">\n      <img\n        src={logo}\n        class=\"h-[40vmin] pointer-events-none animate-[spin_20s_linear_infinite]\"\n        alt=\"logo\"\n      />\n      <p>\n        Edit <code>src/App.jsx</code> and save to reload.\n      </p>\n      <a\n        class=\"text-[#61dafb] hover:underline\"\n        href=\"https://solidjs.com\"\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n      >\n        Learn Solid\n      </a>\n      <a\n        class=\"text-[#61dafb] hover:underline\"\n        href=\"https://tanstack.com\"\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n      >\n        Learn TanStack\n      </a>\n    </main>\n  )\n}\n\nexport default App\n",
     "/src/main.jsx": "import {\n  Outlet,\n  RouterProvider,\n  createRootRoute,\n  createRoute,\n  createRouter,\n} from '@tanstack/solid-router'\nimport { TanStackRouterDevtools } from '@tanstack/solid-router-devtools'\nimport { render } from 'solid-js/web'\n\nimport './styles.css'\n\nimport App from './App.jsx'\n\nconst rootRoute = createRootRoute({\n  component: () => (\n    <>\n      <Outlet />\n      <TanStackRouterDevtools />\n    </>\n  ),\n})\n\nconst indexRoute = createRoute({\n  getParentRoute: () => rootRoute,\n  path: '/',\n  component: App,\n})\n\nconst routeTree = rootRoute.addChildren([indexRoute])\n\nconst router = createRouter({\n  routeTree,\n  defaultPreload: 'intent',\n  scrollRestoration: true,\n})\n\nfunction MainApp() {\n  return (\n    <>\n      <RouterProvider router={router} />\n    </>\n  )\n}\n\nconst rootElement = document.getElementById('app')\nif (rootElement) {\n  render(() => <MainApp />, rootElement)\n}\n",
     "/src/styles.css": "@import \"tailwindcss\";\n\nbody {\n  @apply m-0;\n  font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\",\n    \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\",\n    sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, \"Courier New\",\n    monospace;\n}\n",
diff --git a/tests/integration-tests/snapshots/solid/solid-cr-ts-npm.json b/tests/integration-tests/snapshots/solid/solid-cr-ts-npm.json
@@ -5,7 +5,7 @@
     "/.vscode/settings.json": "{\n  \"files.watcherExclude\": {\n    \"**/routeTree.gen.ts\": true\n  },\n  \"search.exclude\": {\n    \"**/routeTree.gen.ts\": true\n  },\n  \"files.readonlyInclude\": {\n    \"**/routeTree.gen.ts\": true\n  }\n}\n",
     "/public/manifest.json": "{\n  \"short_name\": \"TanStack App\",\n  \"name\": \"Create TanStack App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"64x64 32x32 24x24 16x16\",\n      \"type\": \"image/x-icon\"\n    },\n    {\n      \"src\": \"logo192.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"192x192\"\n    },\n    {\n      \"src\": \"logo512.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"512x512\"\n    }\n  ],\n  \"start_url\": \".\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n",
     "/public/robots.txt": "# https://www.robotstxt.org/robotstxt.html\nUser-agent: *\nDisallow:\n",
-    "/src/App.css": "",
+    "/src/App.css": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  height: 40vmin;\n  pointer-events: none;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .App-logo {\n    animation: App-logo-spin infinite 20s linear;\n  }\n}\n\n.App-header {\n  background-color: #282c34;\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  font-size: calc(10px + 2vmin);\n  color: white;\n}\n\n.App-link {\n  color: #61dafb;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}",
     "/src/App.tsx": "import logo from './logo.svg'\n\nfunction App() {\n  return (\n    <main class=\"min-h-screen flex flex-col items-center justify-center bg-[#282c34] text-white text-[calc(10px+2vmin)] text-center\">\n      <img\n        src={logo}\n        class=\"h-[40vmin] pointer-events-none animate-[spin_20s_linear_infinite]\"\n        alt=\"logo\"\n      />\n      <p>\n        Edit <code>src/App.tsx</code> and save to reload.\n      </p>\n      <a\n        class=\"text-[#61dafb] hover:underline\"\n        href=\"https://solidjs.com\"\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n      >\n        Learn Solid\n      </a>\n      <a\n        class=\"text-[#61dafb] hover:underline\"\n        href=\"https://tanstack.com\"\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n      >\n        Learn TanStack\n      </a>\n    </main>\n  )\n}\n\nexport default App\n",
     "/src/main.tsx": "import {\n  Outlet,\n  RouterProvider,\n  createRootRoute,\n  createRoute,\n  createRouter,\n} from '@tanstack/solid-router'\nimport { TanStackRouterDevtools } from '@tanstack/solid-router-devtools'\nimport { render } from 'solid-js/web'\n\nimport './styles.css'\n\nimport App from './App.tsx'\n\nconst rootRoute = createRootRoute({\n  component: () => (\n    <>\n      <Outlet />\n      <TanStackRouterDevtools />\n    </>\n  ),\n})\n\nconst indexRoute = createRoute({\n  getParentRoute: () => rootRoute,\n  path: '/',\n  component: App,\n})\n\nconst routeTree = rootRoute.addChildren([indexRoute])\n\nconst router = createRouter({\n  routeTree,\n  defaultPreload: 'intent',\n  scrollRestoration: true,\n})\n\ndeclare module '@tanstack/solid-router' {\n  interface Register {\n    router: typeof router\n  }\n}\n\nfunction MainApp() {\n  return (\n    <>\n      <RouterProvider router={router} />\n    </>\n  )\n}\n\nconst rootElement = document.getElementById('app')\nif (rootElement) {\n  render(() => <MainApp />, rootElement)\n}\n",
     "/src/styles.css": "@import \"tailwindcss\";\n\nbody {\n  @apply m-0;\n  font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\",\n    \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\",\n    sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, \"Courier New\",\n    monospace;\n}\n",
diff --git a/tests/integration-tests/snapshots/solid/solid-fr-ts-npm.json b/tests/integration-tests/snapshots/solid/solid-fr-ts-npm.json
@@ -5,7 +5,7 @@
     "/.vscode/settings.json": "{\n  \"files.watcherExclude\": {\n    \"**/routeTree.gen.ts\": true\n  },\n  \"search.exclude\": {\n    \"**/routeTree.gen.ts\": true\n  },\n  \"files.readonlyInclude\": {\n    \"**/routeTree.gen.ts\": true\n  }\n}\n",
     "/public/manifest.json": "{\n  \"short_name\": \"TanStack App\",\n  \"name\": \"Create TanStack App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"64x64 32x32 24x24 16x16\",\n      \"type\": \"image/x-icon\"\n    },\n    {\n      \"src\": \"logo192.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"192x192\"\n    },\n    {\n      \"src\": \"logo512.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"512x512\"\n    }\n  ],\n  \"start_url\": \".\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n",
     "/public/robots.txt": "# https://www.robotstxt.org/robotstxt.html\nUser-agent: *\nDisallow:\n",
-    "/src/App.css": "",
+    "/src/App.css": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  height: 40vmin;\n  pointer-events: none;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .App-logo {\n    animation: App-logo-spin infinite 20s linear;\n  }\n}\n\n.App-header {\n  background-color: #282c34;\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  font-size: calc(10px + 2vmin);\n  color: white;\n}\n\n.App-link {\n  color: #61dafb;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}",
     "/src/main.tsx": "import { RouterProvider, createRouter } from '@tanstack/solid-router'\nimport { render } from 'solid-js/web'\n\nimport { routeTree } from './routeTree.gen'\nimport './styles.css'\n\nconst router = createRouter({\n  routeTree,\n  defaultPreload: 'intent',\n  scrollRestoration: true,\n  defaultPreloadStaleTime: 0,\n})\n\ndeclare module '@tanstack/solid-router' {\n  interface Register {\n    router: typeof router\n  }\n}\n\nfunction App() {\n  return (\n    <>\n      <RouterProvider router={router} />\n    </>\n  )\n}\n\nconst rootElement = document.getElementById('app')\nif (rootElement) {\n  render(() => <App />, rootElement)\n}\n",
     "/src/routes/__root.tsx": "import { Outlet, createRootRouteWithContext } from '@tanstack/solid-router'\nimport { TanStackRouterDevtools } from '@tanstack/solid-router-devtools'\n\nexport const Route = createRootRouteWithContext()({\n  component: RootComponent,\n})\n\nfunction RootComponent() {\n  return (\n    <>\n      <Outlet />\n      {/* <TanStackRouterDevtools /> */}\n    </>\n  )\n}\n",
     "/src/routes/index.tsx": "import * as Solid from 'solid-js'\nimport { createFileRoute } from '@tanstack/solid-router'\n\nimport Header from '../components/Header'\nimport logo from '../logo.svg'\n\nexport const Route = createFileRoute('/')({\n  component: IndexComponent,\n})\n\nfunction IndexComponent() {\n  return (\n    <div class=\"text-center\">\n      <Header />\n      <header class=\"min-h-screen flex flex-col items-center justify-center bg-[#282c34] text-white text-[calc(10px+2vmin)]\">\n        <img\n          src={logo}\n          class=\"h-[40vmin] pointer-events-none animate-[spin_20s_linear_infinite]\"\n          alt=\"logo\"\n        />\n        <p>\n          Edit <code>src/routes/index.tsx</code> and save to reload.\n        </p>\n        <a\n          class=\"text-[#61dafb] hover:underline\"\n          href=\"https://solidjs.com\"\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n        >\n          Learn Solid\n        </a>\n        <a\n          class=\"text-[#61dafb] hover:underline\"\n          href=\"https://tanstack.com\"\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n        >\n          Learn TanStack\n        </a>\n      </header>\n    </div>\n  )\n}\n",

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-.App {`
	`1`	`+<% if (tailwind) { ignoreFile() } %>.App {`
`2`	`2`	`text-align: center;`
`3`	`3`	`}`
`4`	`4`