Clean up create-turbo logs. (#8516)

### Description The `create-turbo` logs needed some love. I've adjusted the information architecture here, made some things more succinct, generally gave it some polish. #### Future work - Detect if the user has global `turbo` installed and, if so, print those - Recommend to install global `turbo` if not installed ### Testing Instructions Try it out! Build it: `cd packages/create-turbo && turbo build` Try it: `node /dist/cli.js` Before: ![CleanShot 2024-06-16 at 11 01 16@2x](https://github.com/vercel/turbo/assets/35677084/55e3a866-c646-49a1-9c82-e719dcb9c974) After: ![CleanShot 2024-06-16 at 11 01 46@2x](https://github.com/vercel/turbo/assets/35677084/029b13cc-da54-4a0f-a7d6-1d9bb1effe67) --------- Co-authored-by: Thomas Knickman <[email protected]> Co-authored-by: Turbobot <[email protected]>
vercel · Jun 20, 2024 · 1aa5f78 · 1aa5f78
1 parent 29d4f41
commit 1aa5f78
Show file tree

Hide file tree

Showing 5 changed files with 89 additions and 63 deletions.
diff --git a/packages/create-turbo/__tests__/index.test.ts b/packages/create-turbo/__tests__/index.test.ts
@@ -94,19 +94,33 @@ describe("create-turbo", () => {
 
       const expected = `${chalk.bold(
         logger.turboGradient(">>> Success!")
-      )} Created a new Turborepo at "${path.relative(process.cwd(), root)}".`;
-
+      )} Created your Turborepo at ${chalk.green(
+        path.relative(process.cwd(), root)
+      )}`;
       expect(mockConsole.log).toHaveBeenCalledWith(expected);
+      expect(mockConsole.log).toHaveBeenCalledWith();
+      expect(mockConsole.log).toHaveBeenCalledWith(
+        chalk.bold("To get started:")
+      );
+
+      expect(mockConsole.log).toHaveBeenCalledWith(
+        chalk.cyan("Library packages")
+      );
+
       expect(mockConsole.log).toHaveBeenCalledWith(
-        "Inside that directory, you can run several commands:"
+        "- Run commands with Turborepo:"
       );
 
       availableScripts.forEach((script) => {
         expect(mockConsole.log).toHaveBeenCalledWith(
-          chalk.cyan(`  ${packageManager} run ${script}`)
+          expect.stringContaining(chalk.cyan(`${packageManager} run ${script}`))
         );
       });
 
+      expect(mockConsole.log).toHaveBeenCalledWith(
+        "- Run a command twice to hit cache"
+      );
+
       mockAvailablePackageManagers.mockRestore();
       mockCreateProject.mockRestore();
       mockGetWorkspaceDetails.mockRestore();
@@ -167,19 +181,32 @@ describe("create-turbo", () => {
 
       const expected = `${chalk.bold(
         logger.turboGradient(">>> Success!")
-      )} Created a new Turborepo at "${path.relative(process.cwd(), root)}".`;
-
+      )} Created your Turborepo at ${chalk.green(
+        path.relative(process.cwd(), root)
+      )}`;
       expect(mockConsole.log).toHaveBeenCalledWith(expected);
+      expect(mockConsole.log).toHaveBeenCalledWith();
       expect(mockConsole.log).toHaveBeenCalledWith(
-        "Inside that directory, you can run several commands:"
+        chalk.bold("To get started:")
+      );
+
+      expect(mockConsole.log).toHaveBeenCalledWith(
+        chalk.cyan("Library packages")
+      );
+
+      expect(mockConsole.log).toHaveBeenCalledWith(
+        "- Run commands with Turborepo:"
       );
 
       availableScripts.forEach((script) => {
         expect(mockConsole.log).toHaveBeenCalledWith(
-          chalk.cyan(`  ${packageManager} run ${script}`)
+          expect.stringContaining(chalk.cyan(`${packageManager} run ${script}`))
         );
       });
 
+      expect(mockConsole.log).toHaveBeenCalledWith(
+        "- Run a command twice to hit cache"
+      );
       mockAvailablePackageManagers.mockRestore();
       mockCreateProject.mockRestore();
       mockGetWorkspaceDetails.mockRestore();

diff --git a/packages/create-turbo/src/commands/create/index.ts b/packages/create-turbo/src/commands/create/index.ts
@@ -77,9 +77,6 @@ export async function create(
   trackOptions(opts);
 
   const { packageManager, skipInstall, skipTransforms } = opts;
-  logger.log(chalk.bold(turboGradient(`\n>>> TURBOREPO\n`)));
-  info(`Welcome to Turborepo! Let's get you set up with a new codebase.`);
-  logger.log();
 
   const [online, availablePackageManagers] = await Promise.all([
     isOnline(),
@@ -177,15 +174,30 @@ export async function create(
         }
       : selectedPackageManagerDetails;
 
-  info("Created a new Turborepo with the following:");
+  info("Creating a new Turborepo with:");
   logger.log();
   if (project.workspaceData.workspaces.length > 0) {
     const workspacesForDisplay = project.workspaceData.workspaces
-      .map((w) => ({
-        group: path.relative(root, w.paths.root).split(path.sep)[0] || "",
-        title: path.relative(root, w.paths.root),
-        description: w.description,
-      }))
+      .map((w) => {
+        const assignGroupTitle = (relPath: string): string => {
+          if (relPath === "apps") {
+            return "Application packages";
+          }
+
+          if (relPath === "packages") {
+            return "Library packages";
+          }
+
+          return relPath;
+        };
+        return {
+          group: assignGroupTitle(
+            path.relative(root, w.paths.root).split(path.sep)[0] || ""
+          ),
+          title: path.relative(root, w.paths.root),
+          description: w.description,
+        };
+      })
       .sort((a, b) => a.title.localeCompare(b.title));
 
     let lastGroup: string | undefined;
@@ -220,9 +232,6 @@ export async function create(
       );
       logger.log();
     } else if (projectPackageManager.version) {
-      logger.log("Installing packages. This might take a couple of minutes.");
-      logger.log();
-
       const loader = turboLoader("Installing dependencies...").start();
       await install({
         project,
@@ -247,39 +256,38 @@ export async function create(
     logger.log(
       `${chalk.bold(
         turboGradient(">>> Success!")
-      )} Created a new Turborepo at "${relativeProjectDir}".`
+      )} Created your Turborepo at ${chalk.green(relativeProjectDir)}`
     );
   }
 
   // get the package manager details so we display the right commands to the user in log messages
   const packageManagerMeta = getPackageManagerMeta(projectPackageManager);
   if (packageManagerMeta && hasPackageJson) {
+    logger.log();
+    logger.log(chalk.bold("To get started:"));
+    if (!projectDirIsCurrentDir) {
+      logger.log(
+        `- Change to the directory: ${chalk.cyan(`cd ${relativeProjectDir}`)}`
+      );
+    }
     logger.log(
-      `Inside ${
-        projectDirIsCurrentDir ? "this" : "that"
-      } directory, you can run several commands:`
+      `- Enable Remote Caching (recommended): ${chalk.cyan(
+        `${packageManagerMeta.executable} turbo login`
+      )}`
     );
+    logger.log(`   - Learn more: https://turbo.build/repo/remote-cache`);
     logger.log();
+    logger.log("- Run commands with Turborepo:");
     availableScripts
       .filter((script) => SCRIPTS_TO_DISPLAY[script])
       .forEach((script) => {
-        logger.log(chalk.cyan(`  ${packageManagerMeta.command} run ${script}`));
-        logger.log(`     ${SCRIPTS_TO_DISPLAY[script]} all apps and packages`);
-        logger.log();
+        logger.log(
+          `   - ${chalk.cyan(`${packageManagerMeta.command} run ${script}`)}: ${
+            SCRIPTS_TO_DISPLAY[script]
+          } all apps and packages`
+        );
       });
-    logger.log(`Turborepo will cache locally by default. For an additional`);
-    logger.log(`speed boost, enable Remote Caching with Vercel by`);
-    logger.log(`entering the following command:`);
-    logger.log();
-    logger.log(chalk.cyan(`  ${packageManagerMeta.executable} turbo login`));
-    logger.log();
-    logger.log(`We suggest that you begin by typing:`);
-    logger.log();
-    if (!projectDirIsCurrentDir) {
-      logger.log(`  ${chalk.cyan("cd")} ${relativeProjectDir}`);
-    }
-    logger.log(chalk.cyan(`  ${packageManagerMeta.executable} turbo login`));
-    logger.log();
+    logger.log("- Run a command twice to hit cache");
   }
   opts.telemetry?.trackCommandStatus({ command: "create", status: "end" });
 }
diff --git a/packages/create-turbo/src/commands/create/prompts.ts b/packages/create-turbo/src/commands/create/prompts.ts
@@ -9,7 +9,7 @@ export async function directory({ dir }: { dir: CreateCommandArgument }) {
   }>({
     type: "input",
     name: "projectDirectory",
-    message: "Where would you like to create your turborepo?",
+    message: "Where would you like to create your Turborepo?",
     when: !dir,
     default: "./my-turborepo",
     validate: (d: string) => {
@@ -53,10 +53,10 @@ export async function packageManager({
       // provided, but isn't available (always allow npm)
       !manager || !availablePackageManagers[manager as PackageManager],
     choices: [
-      { pm: "npm", label: "npm workspaces" },
-      { pm: "pnpm", label: "pnpm workspaces" },
-      { pm: "yarn", label: "yarn workspaces" },
-      { pm: "bun", label: "bun workspaces (beta)" },
+      { pm: "npm", label: "npm" },
+      { pm: "pnpm", label: "pnpm" },
+      { pm: "yarn", label: "yarn" },
+      { pm: "bun", label: "Bun (beta)" },
     ].map(({ pm, label }) => ({
       name: label,
       value: pm,

diff --git a/packages/turbo-utils/src/createProject.ts b/packages/turbo-utils/src/createProject.ts
@@ -147,27 +147,18 @@ export async function createProject({
   /**
    * clone the example repository
    */
-  const loader = logger.turboLoader("Downloading files...");
+  logger.log();
+  const loader = logger.turboLoader(
+    "Downloading files... (This might take a moment)"
+  );
   try {
     if (!isDefaultExample && repoInfo) {
-      logger.log(
-        `\nDownloading files from repo ${chalk.cyan(
-          example
-        )}. This might take a moment.`
-      );
-      logger.log();
       loader.start();
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- this is type guarded above (wtf TS)
       await retry(() => downloadAndExtractRepo(root, repoInfo!), {
         retries: 3,
       });
     } else {
-      logger.log(
-        `\nDownloading files${
-          !isDefaultExample ? ` for example ${chalk.cyan(example)}` : ""
-        }. This might take a moment.`
-      );
-      logger.log();
       loader.start();
       await retry(() => downloadAndExtractExample(root, example), {
         retries: 3,

diff --git a/packages/turbo-workspaces/src/commands/convert/index.ts b/packages/turbo-workspaces/src/commands/convert/index.ts
@@ -75,15 +75,15 @@ export async function convertCommand(
   }>({
     name: "packageManagerInput",
     type: "list",
-    message: `Convert from ${project.packageManager} workspaces to:`,
+    message: `Convert from ${project.packageManager} to:`,
     when:
       !packageManager ||
       !Object.keys(availablePackageManagers).includes(packageManager),
     choices: [
-      { pm: "npm", label: "npm workspaces" },
-      { pm: "pnpm", label: "pnpm workspaces" },
-      { pm: "yarn", label: "yarn workspaces" },
-      { pm: "bun", label: "bun workspaces (beta)" },
+      { pm: "npm", label: "npm" },
+      { pm: "pnpm", label: "pnpm" },
+      { pm: "yarn", label: "yarn" },
+      { pm: "bun", label: "Bun (beta)" },
     ].map(({ pm, label }) => ({
       name: label,
       value: pm,