create-next-app
create-next-app
CLIを使用すると、デフォルトテンプレート、または公開されているGitHubリポジトリの例を使用して、新しいNext.jsアプリケーションを作成できます。これはNext.jsを始める最も簡単な方法です。
基本的な使用法
ターミナル
npx create-next-app@latest [project-name] [options]
リファレンス
以下のオプションが利用可能です
オプション | 説明 |
---|---|
-h または --help | 利用可能なすべてのオプションを表示します |
-v または --version | バージョン番号を出力します |
--no-* | デフォルトオプションを無効にします。例:--no-eslint |
--ts または --typescript | TypeScriptプロジェクトとして初期化します (デフォルト) |
--js または --javascript | JavaScriptプロジェクトとして初期化します |
--tailwind | Tailwind CSSの設定で初期化します (デフォルト) |
--eslint | ESLintの設定で初期化します |
--app | App Routerプロジェクトとして初期化します |
--api | ルートハンドラのみを含むプロジェクトを初期化します |
--src-dir | src/ ディレクトリ内に初期化します |
--turbopack | 開発用にTurbopackをデフォルトで有効にします |
--import-alias <alias-to-configure> | 使用するインポートエイリアスを指定します (デフォルト: "@/*") |
--empty | 空のプロジェクトを初期化します |
--use-npm | CLIにnpmを使用してアプリケーションをブートストラップするよう明示的に指示します |
--use-pnpm | CLIにpnpmを使用してアプリケーションをブートストラップするよう明示的に指示します |
--use-yarn | CLIにYarnを使用してアプリケーションをブートストラップするよう明示的に指示します |
--use-bun | CLIにBunを使用してアプリケーションをブートストラップするよう明示的に指示します |
-e または --example [name] [github-url] | アプリをブートストラップするための例 |
--example-path <path-to-example> | 例へのパスを個別に指定します |
--reset-preferences | CLIに保存されているすべての設定をリセットするよう明示的に指示します |
--skip-install | CLIにパッケージのインストールをスキップするよう明示的に指示します |
--yes | すべてのオプションについて、以前の設定またはデフォルトを使用します |
例
デフォルトテンプレートを使用
デフォルトテンプレートを使用して新しいアプリを作成するには、ターミナルで以下のコマンドを実行します
ターミナル
npx create-next-app@latest
その後、以下のプロンプトが表示されます
ターミナル
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 your code inside a `src/` directory? No / Yes
Would you like to use App Router? (recommended) No / Yes
Would you like to use Turbopack for `next dev`? No / Yes
Would you like to customize the import alias (`@/*` by default)? No / Yes
プロンプトに回答すると、選択した設定で新しいプロジェクトが作成されます。
公式Next.jsの例を使用
公式Next.jsの例を使用して新しいアプリを作成するには、--example
フラグを使用します。例:
ターミナル
npx create-next-app@latest --example [example-name] [your-project-name]
利用可能なすべての例とセットアップ手順は、Next.jsリポジトリで確認できます。
任意の公開GitHubの例を使用
任意の公開GitHubの例を使用して新しいアプリを作成するには、GitHubリポジトリのURLと共に--example
オプションを使用します。例:
ターミナル
npx create-next-app@latest --example "https://github.com/.../" [your-project-name]
お役に立ちましたか?