feat(create-next-app): JS/TS prompt; enhance tests

This adds a prompt to the create-next-app CLI to ask if the user wants to use
TypeScript or JavaScript.

It also adds tests for the different templates (JS, TS, and experimentalApp),
and some helpers to check whether an emitted project contains the correct files:

- projectFilesShouldExist({ projectName, cwd, files })
- projectFilesShouldNotExist({ projectName, cwd, files })

And higher-level helpers for checking that an emitted project contains the
correct files per a template specification in
test/integration/create-next-app/lib/projectFiles:

- shouldBeJavaScriptProject({ projectName, cwd })
- shouldBeTypeScriptProject({ projectName, cwd })
- shouldBeAppProject({ projectName, cwd })

docs/getting-started.md

@@ -19,7 +19,12 @@ If you have questions about anything related to Next.js, you're always welcome t
 
 ## Automatic Setup
 
-We recommend creating a new Next.js app using `create-next-app`, which sets up everything automatically for you. To create a project, run:
+We recommend creating a new Next.js app using `create-next-app`, which sets up
+everything automatically for you.
+
+### Interactive
+
+You can create a new project interactively by running:
 
 ```bash
 npx create-next-app@latest
@@ -29,14 +34,63 @@ yarn create next-app
 pnpm create next-app
 ```
 
-If you want to start with a TypeScript project you can use the `--typescript` flag:
+You will be asked for the name of your project, and then whether you want to
+create a TypeScript project:
+
+```
+✔ Would you like to use TypeScript with this project? … No / Yes
+```
+
+Select **Yes** to install the necessary types/dependencies and create a new TS project.
+
+### Non-interactive
+
+You can also pass command line arguments to set up a new project
+non-interactively. See `create-next-app --help`:
+
+```
+create-next-app <project-directory> [options]
+
+Options:
+  -V, --version                      output the version number
+  --ts, --typescript
+
+    Initialize as a TypeScript project. (default)
+
+  --js, --javascript
+
+    Initialize as a JavaScript project.
+
+  --use-npm
+
+    Explicitly tell the CLI to bootstrap the app using npm
+
+  --use-pnpm
+
+    Explicitly tell the CLI to bootstrap the app using pnpm
+
+  -e, --example [name]|[github-url]
+
+    An example to bootstrap the app with. You can use an example name
+    from the official Next.js repo or a GitHub URL. The URL can use
+    any branch and/or subdirectory
+
+  --example-path <path-to-example>
+
+    In a rare case, your GitHub URL might contain a branch name with
+    a slash (e.g. bug/fix-1) and the path to the example (e.g. foo/bar).
+    In this case, you must specify the path to the example separately:
+    --example-path foo/bar
+```
+
+#### Examples
 
 ```bash
-npx create-next-app@latest --typescript
+npx create-next-app@latest --ts my-project
 # or
-yarn create next-app --typescript
+yarn create next-app --js my-project
 # or
-pnpm create next-app --typescript
+pnpm create next-app --javascript my-project
 ```
 
 After the installation is complete:

packages/create-next-app/index.ts

@@ -23,7 +23,14 @@ const program = new Commander.Command(packageJson.name)
     '--ts, --typescript',
     `
 
-  Initialize as a TypeScript project.
+  Initialize as a TypeScript project. (default)
+`
+  )
+  .option(
+    '--js, --javascript',
+    `
+
+  Initialize as a JavaScript project.
 `
   )
   .option(
@@ -136,13 +143,52 @@ async function run(): Promise<void> {
   }
 
   const example = typeof program.example === 'string' && program.example.trim()
+
+  /**
+   * If the user does not provide the necessary flags, prompt them for whether
+   * to use TS or JS.
+   *
+   * @todo Allow appDir to support TS or JS, currently TS-only and disables all
+   * --ts, --js features.
+   */
+  if (!program.experimentalApp && !program.typescript && !program.javascript) {
+    const styledTypeScript = chalk.hex('#007acc')('TypeScript')
+    const { typescript } = await prompts(
+      {
+        type: 'toggle',
+        name: 'typescript',
+        message: `Would you like to use ${styledTypeScript} with this project?`,
+        initial: true,
+        active: 'Yes',
+        inactive: 'No',
+      },
+      {
+        /**
+         * User inputs Ctrl+C or Ctrl+D to exit the prompt. We should close the
+         * process and not write to the file system.
+         */
+        onCancel: () => {
+          console.error('Exiting.')
+          process.exit(1)
+        },
+      }
+    )
+
+    if (typescript) {
+      program.typescript = true
+    } else {
+      program.javascript = false
+      program.javascript = true
+    }
+  }
+
   try {
     await createApp({
       appPath: resolvedProjectPath,
       packageManager,
       example: example && example !== 'default' ? example : undefined,
       examplePath: program.examplePath,
-      typescript: program.typescript,
+      typescript: !program.javascript || program.typescript,
       experimentalApp: program.experimentalApp,
     })
   } catch (reason) {