vercel · jaredpalmer · Dec 24, 2021 · Dec 23, 2021 · Dec 24, 2021 · Dec 24, 2021
@@ -72,7 +72,7 @@ describe("create-turbo cli", () => {
         case 3:
           // Which package manager do you want to use?
           // easy to change deployment targets.
-          expect(getPromptChoices(prompt)).toEqual(["Yarn", "NPM"]);
+          expect(getPromptChoices(prompt)).toEqual(["npm", "pnpm", "yarn"]);
           cli.stdin.write(keys.enter);
           break;
         case 4:
@@ -127,7 +127,8 @@ describe("create-turbo cli", () => {
           If <dir> is not provided up front you will be prompted for it.
 
           Flags:    
-            --use-npm           Explicitly tell the CLI to bootstrap the app using npm.
+            --use-npm           Explicitly tell the CLI to bootstrap the app using npm
+            --use-pnpm          Explicitly tell the CLI to bootstrap the app using pnpm
             --no-install        Explicitly do not run the package mananger's install command
             --help, -h          Show this help message
             --version, -v       Show the version of this script
@@ -150,7 +151,8 @@ describe("create-turbo cli", () => {
           If <dir> is not provided up front you will be prompted for it.
 
           Flags:    
-            --use-npm           Explicitly tell the CLI to bootstrap the app using npm.
+            --use-npm           Explicitly tell the CLI to bootstrap the app using npm
+            --use-pnpm          Explicitly tell the CLI to bootstrap the app using pnpm
             --no-install        Explicitly do not run the package mananger's install command
             --help, -h          Show this help message
             --version, -v       Show the version of this script

@@ -11,17 +11,25 @@ import checkForUpdate from "update-check";
 import chalk from "chalk";
 import cliPkgJson from "../package.json";
 import { shouldUseYarn } from "./shouldUseYarn";
+import { shouldUsePnpm } from "./shouldUsePnpm";
 import { tryGitInit } from "./git";
 
+type PackageManager = "yarn" | "pnpm" | "npm";
+interface Answers {
+  packageManager: PackageManager;
+}
+
 const turboGradient = gradient("#0099F7", "#F11712");
+
 const help = `
   Usage:
     $ npx create-turbo [flags...] [<dir>]
 
   If <dir> is not provided up front you will be prompted for it.
 
   Flags:    
-    --use-npm           Explicitly tell the CLI to bootstrap the app using npm.
+    --use-npm           Explicitly tell the CLI to bootstrap the app using npm
+    --use-pnpm          Explicitly tell the CLI to bootstrap the app using pnpm
     --no-install        Explicitly do not run the package mananger's install command
     --help, -h          Show this help message
     --version, -v       Show the version of this script
@@ -51,6 +59,7 @@ async function run() {
     flags: {
       help: { type: "boolean", default: false, alias: "h" },
       useNpm: { type: "boolean", default: false },
+      usePnpm: { type: "boolean", default: false },
       install: { type: "boolean", default: true },
       version: { type: "boolean", default: false, alias: "v" },
     },
@@ -85,24 +94,32 @@ async function run() {
   );
 
   const isYarnInstalled = shouldUseYarn();
-  let answers;
+  const isPnpmInstalled = shouldUsePnpm();
+  let answers: Answers;
   if (flags.useNpm) {
     answers = { packageManager: "npm" };
+  } else if (flags.usePnpm) {
+    answers = { packageManager: "pnpm" };
   } else {
     answers = await inquirer.prompt<{
-      packageManager: "yarn" | "npm";
+      packageManager: PackageManager;
     }>([
       {
         name: "packageManager",
         type: "list",
         message: "Which package manager do you want to use?",
         choices: [
+          { name: "npm", value: "npm" },
           {
-            name: "Yarn",
+            name: "pnpm",
+            value: "pnpm",
+            disabled: !isPnpmInstalled && "not installed",
+          },
+          {
+            name: "yarn",
             value: "yarn",
             disabled: !isYarnInstalled && "not installed",
           },
-          { name: "NPM", value: "npm" },
         ],
       },
     ]);
@@ -248,14 +265,18 @@ async function run() {
   console.log(`speed boost, enable Remote Caching (beta) with Vercel by`);
   console.log(`entering the following command:`);
   console.log();
-  console.log(chalk.cyan(`  npx turbo login`));
+  console.log(
+    chalk.cyan(`  ${getNpxCommand(answers.packageManager)} turbo login`)
+  );
   console.log();
   console.log(`We suggest that you begin by typing:`);
   console.log();
   if (!projectDirIsCurrentDir) {
     console.log(`  ${chalk.cyan("cd")} ${relativeProjectDir}`);
   }
-  console.log(chalk.cyan(`  npx turbo login`));
+  console.log(
+    chalk.cyan(`  ${getNpxCommand(answers.packageManager)} turbo login`)
+  );
   console.log();
 }
 
@@ -284,3 +305,13 @@ async function notifyUpdate(): Promise<void> {
     // ignore error
   }
 }
+
+function getNpxCommand(pkgManager: PackageManager): string {
+  if (pkgManager === "yarn") {
+    return "npx";
+  } else if (pkgManager === "pnpm") {
+    return "pnpx";
+  } else {
+    return "npx";
+  }
+}
@@ -0,0 +1,14 @@
+import { execSync } from "child_process";
+
+export function shouldUsePnpm(): boolean {
+  try {
+    const userAgent = process.env.npm_config_user_agent;
+    if (userAgent && userAgent.startsWith("pnpm")) {
+      return true;
+    }
+    execSync("pnpm --version", { stdio: "ignore" });
+    return true;
+  } catch (e) {
+    return false;
+  }
+}
@@ -1,10 +1,10 @@
-# Turborepo starter with PNPM
+# Turborepo starter with pnpm
 
 This is an official starter turborepo.
 
 ## What's inside?
 
-This turborepo uses [PNPM](https://pnpm.io) as a packages manager. It includes the following packages/apps:
+This turborepo uses [pnpm](https://pnpm.io) as a packages manager. It includes the following packages/apps:
 
 ### Apps and Packages
 
@@ -55,15 +55,15 @@ By default, Turborepo will cache locally. To enable Remote Caching (Beta) you wi
 
 ```
 cd my-turborepo
-npx turbo login
+pnpx turbo login
 ```
 
 This will authenticate the Turborepo CLI with your [Vercel account](https://vercel.com/docs/concepts/personal-accounts/overview).
 
 Next, you can link your Turborepo to your Remote Cache by running the following command from the root of your turborepo:
 
 ```
-npx turbo link
+pnpx turbo link
 ```
 
 ## Useful Links

@@ -0,0 +1,25 @@
+{
+  "name": "docs",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev --port 3001",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "next": "12.0.3",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "ui": "workspace:*"
+  },
+  "devDependencies": {
+    "config": "workspace:*",
+    "eslint": "7.32.0",
+    "next-transpile-modules": "9.0.0",
+    "tsconfig": "workspace:*",
+    "@types/react": "17.0.37",
+    "typescript": "^4.5.3"
+  }
+}
@@ -0,0 +1,25 @@
+{
+  "name": "web",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "next": "12.0.3",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "ui": "workspace:*"
+  },
+  "devDependencies": {
+    "config": "workspace:*",
+    "eslint": "7.32.0",
+    "next-transpile-modules": "9.0.0",
+    "tsconfig": "workspace:*",
+    "@types/react": "17.0.37",
+    "typescript": "^4.5.3"
+  }
+}
@@ -0,0 +1,13 @@
+{
+  "name": "ui",
+  "version": "0.0.0",
+  "main": "./index.tsx",
+  "types": "./index.tsx",
+  "license": "MIT",
+  "devDependencies": {
+    "@types/react": "^17.0.37",
+    "@types/react-dom": "^17.0.11",
+    "tsconfig": "workspace:*",
+    "typescript": "^4.5.3"
+  }
+}