create-astro 0.10.0 → 0.12.0

package/dist/index.js

@@ -1,32 +1,13 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
 import fs from "fs";
 import path from "path";
-import { bold, cyan, gray, green, red, yellow } from "kleur/colors";
-import fetch from "node-fetch";
+import { bgCyan, black, bold, cyan, gray, green, red, yellow } from "kleur/colors";
 import prompts from "prompts";
 import degit from "degit";
 import yargs from "yargs-parser";
 import ora from "ora";
-import { FRAMEWORKS, COUNTER_COMPONENTS } from "./frameworks.js";
 import { TEMPLATES } from "./templates.js";
-import { createConfig } from "./config.js";
 import { logger, defaultLogLevel } from "./logger.js";
-import { execa } from "execa";
+import { execa, execaCommand } from "execa";
 const cleanArgv = process.argv.filter((arg) => arg !== "--");
 const args = yargs(cleanArgv);
 prompts.override(args);
@@ -43,15 +24,12 @@ function isEmpty(dirPath) {
   return !fs.existsSync(dirPath) || fs.readdirSync(dirPath).length === 0;
 }
 const { version } = JSON.parse(fs.readFileSync(new URL("../package.json", import.meta.url), "utf-8"));
-const FILES_TO_REMOVE = [".stackblitzrc", "sandbox.config.json"];
-const POSTPROCESS_FILES = ["package.json", "astro.config.mjs", "CHANGELOG.md"];
+const FILES_TO_REMOVE = [".stackblitzrc", "sandbox.config.json", "CHANGELOG.md"];
 async function main() {
   const pkgManager = pkgManagerFromUserAgent(process.env.npm_config_user_agent);
   logger.debug("Verbose logging turned on");
   console.log(`
 ${bold("Welcome to Astro!")} ${gray(`(create-astro v${version})`)}`);
-  console.log(`If you encounter a problem, visit ${cyan("https://github.com/withastro/astro/issues")} to search or file a new issue.
-`);
   let spinner = ora({ color: "green", text: "Prepare for liftoff." });
   spinner.succeed();
   let cwd = args["_"][2];
@@ -63,7 +41,7 @@ ${bold("Welcome to Astro!")} ${gray(`(create-astro v${version})`)}`);
     acknowledgeProjectDir.succeed();
   }
   if (!cwd || !isEmpty(cwd)) {
-    const notEmptyMsg = (dirPath) => `"${bold(dirPath)}" is not empty. Please clear contents or choose a different path.`;
+    const notEmptyMsg = (dirPath) => `"${bold(dirPath)}" is not empty!`;
     if (!isEmpty(cwd)) {
       let rejectProjectDir = ora({ color: "red", text: notEmptyMsg(cwd) });
       rejectProjectDir.fail();
@@ -97,7 +75,7 @@ ${bold("Welcome to Astro!")} ${gray(`(create-astro v${version})`)}`);
     process.exit(1);
   }
   const hash = args.commit ? `#${args.commit}` : "";
-  const templateTarget = options.template.includes("/") ? options.template : `withastro/astro/examples/${options.template}#latest`;
+  const templateTarget = `withastro/astro/examples/${options.template}#latest`;
   const emitter = degit(`${templateTarget}${hash}`, {
     cache: false,
     force: true,
@@ -108,19 +86,6 @@ ${bold("Welcome to Astro!")} ${gray(`(create-astro v${version})`)}`);
     force: true,
     verbose: defaultLogLevel === "debug" ? true : false
   });
-  const selectedTemplate = TEMPLATES.find((template) => template.value === options.template);
-  let integrations = [];
-  if ((selectedTemplate == null ? void 0 : selectedTemplate.integrations) === true) {
-    const result = await prompts([
-      {
-        type: "multiselect",
-        name: "integrations",
-        message: "Which frameworks would you like to use?",
-        choices: FRAMEWORKS
-      }
-    ]);
-    integrations = result.integrations;
-  }
   spinner = ora({ color: "green", text: "Copying project files..." }).start();
   if (!args.dryrun) {
     try {
@@ -142,67 +107,12 @@ ${bold("Welcome to Astro!")} ${gray(`(create-astro v${version})`)}`);
       spinner.fail();
       process.exit(1);
     }
-    await Promise.all([
-      ...FILES_TO_REMOVE.map(async (file) => {
-        const fileLoc = path.resolve(path.join(cwd, file));
-        return fs.promises.rm(fileLoc);
-      }),
-      ...POSTPROCESS_FILES.map(async (file) => {
-        const fileLoc = path.resolve(path.join(cwd, file));
-        switch (file) {
-          case "CHANGELOG.md": {
-            if (fs.existsSync(fileLoc)) {
-              await fs.promises.unlink(fileLoc);
-            }
-            break;
-          }
-          case "astro.config.mjs": {
-            if ((selectedTemplate == null ? void 0 : selectedTemplate.integrations) !== true) {
-              break;
-            }
-            await fs.promises.writeFile(fileLoc, createConfig({ integrations }));
-            break;
-          }
-          case "package.json": {
-            const packageJSON = JSON.parse(await fs.promises.readFile(fileLoc, "utf8"));
-            delete packageJSON.snowpack;
-            const integrationEntries = (await Promise.all(integrations.map((integration) => fetch(`https://registry.npmjs.org/${integration.packageName}/latest`).then((res) => res.json()).then((res) => {
-              let dependencies = [[res["name"], `^${res["version"]}`]];
-              if (res["peerDependencies"]) {
-                for (const peer in res["peerDependencies"]) {
-                  dependencies.push([peer, res["peerDependencies"][peer]]);
-                }
-              }
-              return dependencies;
-            })))).flat(1);
-            packageJSON.devDependencies = __spreadValues(__spreadValues({}, packageJSON.devDependencies ?? {}), Object.fromEntries(integrationEntries));
-            packageJSON.devDependencies = Object.fromEntries(Object.entries(packageJSON.devDependencies).sort((a, b) => a[0].localeCompare(b[0])));
-            await fs.promises.writeFile(fileLoc, JSON.stringify(packageJSON, void 0, 2));
-            break;
-          }
-        }
-      })
-    ]);
-    if ((selectedTemplate == null ? void 0 : selectedTemplate.value) === "starter") {
-      let importStatements = [];
-      let components = [];
-      await Promise.all(integrations.map(async (integration) => {
-        const component = COUNTER_COMPONENTS[integration.id];
-        const componentName = path.basename(component.filename, path.extname(component.filename));
-        const absFileLoc = path.resolve(cwd, component.filename);
-        importStatements.push(`import ${componentName} from '${component.filename.replace(/^src/, "..")}';`);
-        components.push(`<${componentName} client:visible />`);
-        await fs.promises.writeFile(absFileLoc, component.content);
-      }));
-      const pageFileLoc = path.resolve(path.join(cwd, "src", "pages", "index.astro"));
-      const content = (await fs.promises.readFile(pageFileLoc)).toString();
-      const newContent = content.replace(/^(\s*)\/\* ASTRO\:COMPONENT_IMPORTS \*\//gm, (_, indent) => {
-        return indent + importStatements.join("\n");
-      }).replace(/^(\s*)<!-- ASTRO:COMPONENT_MARKUP -->/gm, (_, indent) => {
-        return components.map((ln) => indent + ln).join("\n");
-      });
-      await fs.promises.writeFile(pageFileLoc, newContent);
-    }
+    await Promise.all(FILES_TO_REMOVE.map(async (file) => {
+      const fileLoc = path.resolve(path.join(cwd, file));
+      if (fs.existsSync(fileLoc)) {
+        return fs.promises.rm(fileLoc, {});
+      }
+    }));
   }
   spinner.succeed();
   console.log(bold(green("\u2714") + " Done!"));
@@ -215,39 +125,65 @@ ${bold("Welcome to Astro!")} ${gray(`(create-astro v${version})`)}`);
   if (!installResponse) {
     process.exit(0);
   }
-  if (installResponse.install) {
+  if (installResponse.install && !args.dryrun) {
     const installExec = execa(pkgManager, ["install"], { cwd });
     const installingPackagesMsg = `Installing packages${emojiWithFallback(" \u{1F4E6}", "...")}`;
     spinner = ora({ color: "green", text: installingPackagesMsg }).start();
-    if (!args.dryrun) {
-      await new Promise((resolve, reject) => {
-        var _a;
-        (_a = installExec.stdout) == null ? void 0 : _a.on("data", function(data) {
-          spinner.text = `${installingPackagesMsg}
+    await new Promise((resolve, reject) => {
+      var _a;
+      (_a = installExec.stdout) == null ? void 0 : _a.on("data", function(data) {
+        spinner.text = `${installingPackagesMsg}
 ${bold(`[${pkgManager}]`)} ${data}`;
-        });
-        installExec.on("error", (error) => reject(error));
-        installExec.on("close", () => resolve());
       });
-    }
+      installExec.on("error", (error) => reject(error));
+      installExec.on("close", () => resolve());
+    });
     spinner.succeed();
   }
-  console.log("\nNext steps:");
-  let i = 1;
+  const astroAddCommand = installResponse.install ? "astro add --yes" : `${pkgManagerExecCommand(pkgManager)} astro@latest add --yes`;
+  const astroAddResponse = await prompts({
+    type: "confirm",
+    name: "astroAdd",
+    message: `Run "${astroAddCommand}?" This lets you optionally add component frameworks (ex. React), CSS frameworks (ex. Tailwind), and more.`,
+    initial: true
+  });
+  if (!astroAddResponse) {
+    process.exit(0);
+  }
+  if (!astroAddResponse.astroAdd) {
+    ora().info(`No problem. You can always run "${pkgManagerExecCommand(pkgManager)} astro add" later!`);
+  }
+  if (astroAddResponse.astroAdd && !args.dryrun) {
+    await execaCommand(astroAddCommand, astroAddCommand === "astro add --yes" ? { cwd, stdio: "inherit", localDir: cwd, preferLocal: true } : { cwd, stdio: "inherit" });
+  }
+  const gitResponse = await prompts({
+    type: "confirm",
+    name: "git",
+    message: "Initialize a git repository?",
+    initial: true
+  });
+  if (!gitResponse) {
+    process.exit(0);
+  }
+  if (gitResponse.git && !args.dryrun) {
+    await execaCommand("git init", { cwd });
+  }
+  console.log(`
+${bgCyan(black(" Next steps "))}
+`);
   const relative = path.relative(process.cwd(), cwd);
+  const startCommand = [];
   if (relative !== "") {
-    console.log(`  ${i++}: ${bold(cyan(`cd ${relative}`))}`);
+    startCommand.push(bold(cyan(`cd ${relative}`)));
   }
   if (!installResponse.install) {
-    console.log(`  ${i++}: ${bold(cyan(`${pkgManager} install`))}`);
+    startCommand.push(bold(cyan(`${pkgManager} install`)));
   }
-  console.log(`  ${i++}: ${bold(cyan('git init && git add -A && git commit -m "Initial commit"'))} (optional step)`);
-  const runCommand = pkgManager === "npm" ? "npm run dev" : `${pkgManager} dev`;
-  console.log(`  ${i++}: ${bold(cyan(runCommand))}`);
+  startCommand.push(bold(cyan(pkgManager === "npm" ? "npm run dev" : `${pkgManager} dev`)));
+  console.log(startCommand.join(" && "));
   console.log(`
 To close the dev server, hit ${bold(cyan("Ctrl-C"))}`);
-  console.log(`
-Stuck? Visit us at ${cyan("https://astro.build/chat")}
+  console.log(`Stuck? Visit us at ${cyan("https://astro.build/chat")}
 `);
 }
 function emojiWithFallback(char, fallback) {
@@ -260,6 +196,13 @@ function pkgManagerFromUserAgent(userAgent) {
   const pkgSpecArr = pkgSpec.split("/");
   return pkgSpecArr[0];
 }
+function pkgManagerExecCommand(pkgManager) {
+  if (pkgManager === "pnpm") {
+    return "pnpx";
+  } else {
+    return "npx";
+  }
+}
 export {
   main,
   mkdirp

package/dist/templates.js

@@ -1,8 +1,7 @@
 const TEMPLATES = [
   {
-    title: "Starter Kit (Generic)",
-    value: "starter",
-    integrations: true
+    title: "Just the basics",
+    value: "basics"
   },
   {
     title: "Blog",
@@ -17,7 +16,7 @@ const TEMPLATES = [
     value: "portfolio"
   },
   {
-    title: "Minimal",
+    title: "Completely empty",
     value: "minimal"
   }
 ];

package/dist/types/templates.d.ts

@@ -1,9 +1,4 @@
-export declare const TEMPLATES: ({
+export declare const TEMPLATES: {
     title: string;
     value: string;
-    integrations: boolean;
-} | {
-    title: string;
-    value: string;
-    integrations?: undefined;
-})[];
+}[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-astro",
-  "version": "0.10.0",
+  "version": "0.12.0",
   "type": "module",
   "author": "withastro",
   "license": "MIT",
@@ -33,7 +33,6 @@
     "degit": "^2.8.4",
     "execa": "^6.1.0",
     "kleur": "^4.1.4",
-    "node-fetch": "^3.2.3",
     "ora": "^6.1.0",
     "prompts": "^2.4.2",
     "yargs-parser": "^21.0.1"

package/dist/config.js

@@ -1,23 +0,0 @@
-const createConfig = ({ integrations }) => {
-  if (integrations.length === 0) {
-    return `import { defineConfig } from 'astro/config';
-// https://astro.build/config
-export default defineConfig({});
-`;
-  }
-  const rendererImports = integrations.map((r) => `  import ${r.id} from '${r.packageName}';`);
-  const rendererIntegrations = integrations.map((r) => `    ${r.id}(),`);
-  return [
-    `import { defineConfig } from 'astro/config';`,
-    ...rendererImports,
-    `// https://astro.build/config`,
-    `export default defineConfig({`,
-    `  integrations: [`,
-    ...rendererIntegrations,
-    `  ]`,
-    `});`
-  ].join("\n");
-};
-export {
-  createConfig
-};

package/dist/frameworks.js

@@ -1,134 +0,0 @@
-const COUNTER_COMPONENTS = {
-  preact: {
-    filename: `src/components/PreactCounter.jsx`,
-    content: `import { useState } from 'preact/hooks';
-
-export default function PreactCounter() {
-  const [count, setCount] = useState(0);
-  const add = () => setCount((i) => i + 1);
-  const subtract = () => setCount((i) => i - 1);
-
-  return (
-    <div id="preact" class="counter">
-      <button onClick={subtract}>-</button>
-      <pre>{count}</pre>
-      <button onClick={add}>+</button>
-    </div>
-  );
-}
-`
-  },
-  react: {
-    filename: `src/components/ReactCounter.jsx`,
-    content: `import { useState } from 'react';
-
-export default function ReactCounter() {
-  const [count, setCount] = useState(0);
-  const add = () => setCount((i) => i + 1);
-  const subtract = () => setCount((i) => i - 1);
-
-  return (
-    <div id="react" className="counter">
-      <button onClick={subtract}>-</button>
-      <pre>{count}</pre>
-      <button onClick={add}>+</button>
-    </div>
-  );
-}
-`
-  },
-  solid: {
-    filename: `src/components/SolidCounter.jsx`,
-    content: `import { createSignal } from "solid-js";
-
-export default function SolidCounter() {
-  const [count, setCount] = createSignal(0);
-  const add = () => setCount(count() + 1);
-  const subtract = () => setCount(count() - 1);
-
-  return (
-    <div id="solid" class="counter">
-      <button onClick={subtract}>-</button>
-      <pre>{count()}</pre>
-      <button onClick={add}>+</button>
-    </div>
-  );
-}
-`
-  },
-  svelte: {
-    filename: `src/components/SvelteCounter.svelte`,
-    content: `<script>
-  let count = 0;
-
-  function add() {
-    count += 1;
-  }
-
-  function subtract() {
-    count -= 1;
-  }
-<\/script>
-
-<div id="svelte" class="counter">
-  <button on:click={subtract}>-</button>
-  <pre>{ count }</pre>
-  <button on:click={add}>+</button>
-</div>
-`
-  },
-  vue: {
-    filename: `src/components/VueCounter.vue`,
-    content: `<template>
-  <div id="vue" class="counter">
-      <button @click="subtract()">-</button>
-      <pre>{{ count }}</pre>
-      <button @click="add()">+</button>
-  </div>
-</template>
-
-<script>
-import { ref } from 'vue';
-export default {
-  setup() {
-    const count = ref(0)
-    const add = () => count.value = count.value + 1;
-    const subtract = () => count.value = count.value - 1;
-
-    return {
-      count,
-      add,
-      subtract
-    }
-  }
-}
-<\/script>
-`
-  }
-};
-const FRAMEWORKS = [
-  {
-    title: "Preact",
-    value: { id: "preact", packageName: "@astrojs/preact" }
-  },
-  {
-    title: "React",
-    value: { id: "react", packageName: "@astrojs/react" }
-  },
-  {
-    title: "Solid.js",
-    value: { id: "solid", packageName: "@astrojs/solid-js" }
-  },
-  {
-    title: "Svelte",
-    value: { id: "svelte", packageName: "@astrojs/svelte" }
-  },
-  {
-    title: "Vue",
-    value: { id: "vue", packageName: "@astrojs/vue" }
-  }
-];
-export {
-  COUNTER_COMPONENTS,
-  FRAMEWORKS
-};

package/dist/types/config.d.ts

@@ -1,4 +0,0 @@
-import type { Integration } from './frameworks';
-export declare const createConfig: ({ integrations }: {
-    integrations: Integration[];
-}) => string;

package/dist/types/frameworks.d.ts

@@ -1,30 +0,0 @@
-export declare const COUNTER_COMPONENTS: {
-    preact: {
-        filename: string;
-        content: string;
-    };
-    react: {
-        filename: string;
-        content: string;
-    };
-    solid: {
-        filename: string;
-        content: string;
-    };
-    svelte: {
-        filename: string;
-        content: string;
-    };
-    vue: {
-        filename: string;
-        content: string;
-    };
-};
-export interface Integration {
-    id: string;
-    packageName: string;
-}
-export declare const FRAMEWORKS: {
-    title: string;
-    value: Integration;
-}[];