命令列介面 (CLI)
create-next-app
CLI 允許您使用預設範本或從公開 GitHub 儲存庫中的範例建立新的 Next.js 應用程式。這是開始使用 Next.js 最簡單的方法。
基本用法 (Basic usage)
終端機 (Terminal)
npx create-next-app@latest [project-name] [options]
參考 (Reference)
以下選項可用 (The following options are available)
選項 (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> | 指定要使用的 import 別名(預設為 "@/*") |
--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 | 對所有選項使用先前的偏好設定或預設值 |
範例
使用預設範本
要在終端機中使用預設範本建立新的應用程式,請執行以下指令
終端機 (Terminal)
npx create-next-app@latest
接著系統會詢問您以下提示
終端機 (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 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
旗標。例如:
終端機 (Terminal)
npx create-next-app@latest --example [example-name] [your-project-name]
您可以在 Next.js 儲存庫 中檢視所有可用範例的清單以及設定說明。
使用任何公開的 GitHub 範例
要使用任何公開的 GitHub 範例來建立新的應用程式,請使用带有 GitHub 儲存庫網址的 --example
選項。例如:
終端機 (Terminal)
npx create-next-app@latest --example "https://github.com/.../" [your-project-name]
這有幫助嗎?