跳至內容
API 參考 (API Reference)CLI (命令列介面)create-next-app (建立 Next 應用程式)

建立 Next 應用程式 (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 專案
--src-dir在 src/ 目錄內初始化
--turbo預設為開發環境啟用 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 儲存庫的網址使用 --example 選項。例如：

終端機
npx create-next-app@latest --example "https://github.com/.../" [your-project-name]