mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
<!-- Thanks for opening a PR! Your contribution is much appreciated. To make sure your PR is handled as smoothly as possible we request that you follow the checklist sections below. Choose the right checklist for the change(s) that you're making: ## For Contributors ### Improving Documentation - Run `pnpm prettier-fix` to fix formatting issues before opening the PR. - Read the Docs Contribution Guide to ensure your contribution follows the docs guidelines: https://nextjs.org/docs/community/contribution-guide ### Adding or Updating Examples - The "examples guidelines" are followed from our contributing doc https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md - Make sure the linting passes by running `pnpm build && pnpm lint`. See https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md ### Fixing a bug - Related issues linked using `fixes #number` - Tests added. See: https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs - Errors have a helpful link attached, see https://github.com/vercel/next.js/blob/canary/contributing.md ### Adding a feature - Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. (A discussion must be opened, see https://github.com/vercel/next.js/discussions/new?category=ideas) - Related issues/discussions are linked using `fixes #number` - e2e tests added (https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) - Documentation added - Telemetry added. In case of a feature if it's used or not. - Errors have a helpful link attached, see https://github.com/vercel/next.js/blob/canary/contributing.md ## For Maintainers - Minimal description (aim for explaining to someone not on the team to understand the PR) - When linking to a Slack thread, you might want to share details of the conclusion - Link both the Linear (Fixes NEXT-xxx) and the GitHub issues - Add review comments if necessary to explain to the reviewer the logic behind a change ### What? ### Why? ### How? Closes NEXT- Fixes # --> ### What? So, i was trying to create a Next.js project with Bun as i was experimenting with it and i got error creating the project `error: could not determine executable to run for package create` so i added `-` after create and works and created by project successfully. ## Before  ## After  --------- Co-authored-by: JJ Kasper <[email protected]>
132 lines
4.2 KiB
Plaintext
132 lines
4.2 KiB
Plaintext
---
|
|
title: create-next-app
|
|
description: Create Next.js apps in one command with create-next-app.
|
|
---
|
|
|
|
{/* 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. */}
|
|
|
|
The easiest way to get started with Next.js is by using `create-next-app`. This CLI tool enables you to quickly start building a new Next.js application, with everything set up for you.
|
|
|
|
You can create a new app using the default Next.js template, or by using one of the [official Next.js examples](https://github.com/vercel/next.js/tree/canary/examples).
|
|
|
|
### Interactive
|
|
|
|
You can create a new project interactively by running:
|
|
|
|
```bash filename="Terminal"
|
|
npx create-next-app@latest
|
|
```
|
|
|
|
```bash filename="Terminal"
|
|
yarn create next-app
|
|
```
|
|
|
|
```bash filename="Terminal"
|
|
pnpm create next-app
|
|
```
|
|
|
|
```bash filename="Terminal"
|
|
bunx create-next-app
|
|
```
|
|
|
|
You will then be asked the following prompts:
|
|
|
|
```txt filename="Terminal"
|
|
What is your project named? my-app
|
|
Would you like to use TypeScript? No / Yes
|
|
Would you like to use ESLint? No / Yes
|
|
Would you like to use Tailwind CSS? No / Yes
|
|
Would you like to use `src/` directory? No / Yes
|
|
Would you like to use App Router? (recommended) No / Yes
|
|
Would you like to customize the default import alias (@/*)? No / Yes
|
|
```
|
|
|
|
Once you've answered the prompts, a new project will be created with the correct configuration depending on your answers.
|
|
|
|
### Non-interactive
|
|
|
|
You can also pass command line arguments to set up a new project non-interactively.
|
|
|
|
Further, you can negate default options by prefixing them with `--no-` (e.g. `--no-eslint`).
|
|
|
|
See `create-next-app --help`:
|
|
|
|
```bash filename="Terminal"
|
|
Usage: 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.
|
|
|
|
--tailwind
|
|
|
|
Initialize with Tailwind CSS config. (default)
|
|
|
|
--eslint
|
|
|
|
Initialize with ESLint config.
|
|
|
|
--app
|
|
|
|
Initialize as an App Router project.
|
|
|
|
--src-dir
|
|
|
|
Initialize inside a `src/` directory.
|
|
|
|
--import-alias <alias-to-configure>
|
|
|
|
Specify import alias to use (default "@/*").
|
|
|
|
--use-npm
|
|
|
|
Explicitly tell the CLI to bootstrap the app using npm
|
|
|
|
--use-pnpm
|
|
|
|
Explicitly tell the CLI to bootstrap the app using pnpm
|
|
|
|
--use-yarn
|
|
|
|
Explicitly tell the CLI to bootstrap the app using Yarn
|
|
|
|
--use-bun
|
|
|
|
Explicitly tell the CLI to bootstrap the app using Bun
|
|
|
|
-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 public 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
|
|
|
|
--reset-preferences
|
|
|
|
Explicitly tell the CLI to reset any stored preferences
|
|
|
|
-h, --help output usage information
|
|
```
|
|
|
|
### Why use Create Next App?
|
|
|
|
`create-next-app` allows you to create a new Next.js app within seconds. It is officially maintained by the creators of Next.js, and includes a number of benefits:
|
|
|
|
- **Interactive Experience**: Running `npx create-next-app@latest` (with no arguments) launches an interactive experience that guides you through setting up a project.
|
|
- **Zero Dependencies**: Initializing a project is as quick as one second. Create Next App has zero dependencies.
|
|
- **Offline Support**: Create Next App will automatically detect if you're offline and bootstrap your project using your local package cache.
|
|
- **Support for Examples**: Create Next App can bootstrap your application using an example from the Next.js examples collection (e.g. `npx create-next-app --example api-routes`) or any public GitHub repository.
|
|
- **Tested**: The package is part of the Next.js monorepo and tested using the same integration test suite as Next.js itself, ensuring it works as expected with every release.
|