|
| 1 | +--- |
| 2 | +title: create-next-app |
| 3 | +description: Create Next.js apps using one command with the create-next-app CLI. |
| 4 | +--- |
| 5 | + |
| 6 | +{/* The content of this doc is shared between the app and pages router. You can use the `<PagesOnly>Content</PagesOnly>` component to add content that is specific to the Pages Router. Any shared content should not be wrapped in a component. */} |
| 7 | + |
| 8 | +The `create-next-app` CLI allow you to quickly create a new Next.js application using the default template or an [example](https://github.com/vercel/next.js/tree/canary/examples) from a public Github repository. It is the easiest way to get started with Next.js. |
| 9 | + |
| 10 | +Basic usage: |
| 11 | + |
| 12 | +```bash filename="Terminal" |
| 13 | +npx create-next-app@latest [project-name] [options] |
| 14 | +``` |
| 15 | + |
| 16 | +## Reference |
| 17 | + |
| 18 | +The following options are available: |
| 19 | + |
| 20 | +| Options | Description | |
| 21 | +| --------------------------------------- | --------------------------------------------------------------- | |
| 22 | +| `-h` or `--help` | Show all available options | |
| 23 | +| `-v` or `--version` | Output the version number | |
| 24 | +| `--no-*` | Negate default options. E.g. `--no-eslint` | |
| 25 | +| `--ts` or `--typescript` | Initialize as a TypeScript project (default) | |
| 26 | +| `--js` or `--javascript` | Initialize as a JavaScript project | |
| 27 | +| `--tailwind` | Initialize with Tailwind CSS config (default) | |
| 28 | +| `--eslint` | Initialize with ESLint config | |
| 29 | +| `--app` | Initialize as an App Router project | |
| 30 | +| `--src-dir` | Initialize inside a `src/` directory | |
| 31 | +| `--turbo` | Enable Turbopack by default for development | |
| 32 | +| `--import-alias <alias-to-configure>` | Specify import alias to use (default "@/\*") | |
| 33 | +| `--empty` | Initialize an empty project | |
| 34 | +| `--use-npm` | Explicitly tell the CLI to bootstrap the application using npm | |
| 35 | +| `--use-pnpm` | Explicitly tell the CLI to bootstrap the application using pnpm | |
| 36 | +| `--use-yarn` | Explicitly tell the CLI to bootstrap the application using Yarn | |
| 37 | +| `--use-bun` | Explicitly tell the CLI to bootstrap the application using Bun | |
| 38 | +| `-e` or `--example [name] [github-url]` | An example to bootstrap the app with | |
| 39 | +| `--example-path <path-to-example>` | Specify the path to the example separately | |
| 40 | +| `--reset-preferences` | Explicitly tell the CLI to reset any stored preferences | |
| 41 | +| `--skip-install` | Explicitly tell the CLI to skip installing packages | |
| 42 | +| `--yes` | Use previous preferences or defaults for all options | |
| 43 | + |
| 44 | +## Examples |
| 45 | + |
| 46 | +## With the default template |
| 47 | + |
| 48 | +To create a new app using the default template, run the following command in your terminal: |
| 49 | + |
| 50 | +```bash filename="Terminal" |
| 51 | +npx create-next-app@latest |
| 52 | +``` |
| 53 | + |
| 54 | +You will then be asked the following prompts: |
| 55 | + |
| 56 | +```txt filename="Terminal" |
| 57 | +What is your project named? my-app |
| 58 | +Would you like to use TypeScript? No / Yes |
| 59 | +Would you like to use ESLint? No / Yes |
| 60 | +Would you like to use Tailwind CSS? No / Yes |
| 61 | +Would you like your code inside a `src/` directory? No / Yes |
| 62 | +Would you like to use App Router? (recommended) No / Yes |
| 63 | +Would you like to use Turbopack for `next dev`? No / Yes |
| 64 | +Would you like to customize the import alias (`@/*` by default)? No / Yes |
| 65 | +``` |
| 66 | + |
| 67 | +Once you've answered the prompts, a new project will be created with your chosen configuration. |
| 68 | + |
| 69 | +## With an official Next.js example |
| 70 | + |
| 71 | +To create a new app using an official Next.js example, use the `--example` flag with the following command: |
| 72 | + |
| 73 | +```bash filename="Terminal" |
| 74 | +npx create-next-app@latest --example [your-project-name] [example-name] |
| 75 | +``` |
| 76 | + |
| 77 | +You can view a list of all available examples along with setup instructions in the [Next.js repository](https://github.com/vercel/next.js/tree/canary/examples). |
| 78 | + |
| 79 | +## With any public Github example |
| 80 | + |
| 81 | +To create a new app using any public Github example, use the `--example` option with the Github repo's URL. For example: |
| 82 | + |
| 83 | +```bash filename="Terminal" |
| 84 | +npx create-next-app@latest --example [your-project-name] "https://github.com/.../" |
| 85 | +``` |
0 commit comments