字
字节笔记本
2026年5月3日
create-next-app - 创建 Next.js 项目命令
API中转
¥120
本文介绍 create-next-app 命令的详细用法,包括完整参数说明、项目结构对比、Turbopack 配置和常用命令组合。
命令
bash
echo "N" | npx create-next-app@latest ralph-auth-demo --typescript --tailwind --eslint --app --src-dir --import-alias "@/*" --use-pnpm参数说明
| 参数 | 说明 |
|---|---|
echo "N" | | 自动回答 "N"(不使用 Turbopack) |
npx create-next-app@latest | 使用最新版 create-next-app |
ralph-auth-demo | 项目名称 |
--typescript | 启用 TypeScript |
--tailwind | 启用 Tailwind CSS |
--eslint | 启用 ESLint |
--app | 使用 App Router |
--src-dir | 使用 src/ 目录 |
--import-alias "@/*" | 设置导入别名 |
--use-pnpm | 使用 pnpm 包管理器 |
使用方法
基本用法
bash
# 交互式创建(会询问各种配置)
npx create-next-app@latest my-app
# 使用所有默认配置
npx create-next-app@latest my-app --ts --tailwind --eslint完整配置命令
bash
# TypeScript + Tailwind + ESLint + App Router + src 目录 + pnpm
npx create-next-app@latest my-app \
--typescript \
--tailwind \
--eslint \
--app \
--src-dir \
--import-alias "@/*" \
--use-pnpm自动回答提示
bash
# 自动回答 "N" 拒绝 Turbopack
echo "N" | npx create-next-app@latest my-app --use-pnpm
# 自动回答多个问题(使用 yes 命令)
yes "" | npx create-next-app@latest my-app所有可用参数
| 参数 | 简写 | 说明 |
|---|---|---|
--typescript | --ts | 启用 TypeScript |
--javascript | --js | 使用 JavaScript |
--tailwind | 启用 Tailwind CSS | |
--eslint | 启用 ESLint | |
--prettier | 启用 Prettier | |
--src-dir | 使用 src/ 目录 | |
--app | 使用 App Router | |
--pages | 使用 Pages Router | |
--import-alias | 设置导入别名(如 @/*) | |
--use-npm | 使用 npm | |
--use-yarn | 使用 yarn | |
--use-pnpm | 使用 pnpm | |
--use-bun | 使用 bun | |
--turbo | 启用 Turbopack | |
--no-git | 不初始化 Git |
项目结构对比
默认结构
text
my-app/
├── app/
│ ├── layout.tsx
│ └── page.tsx
├── public/
├── next.config.js
├── package.json
└── tsconfig.json使用 --src-dir
text
my-app/
├── src/
│ └── app/
│ ├── layout.tsx
│ └── page.tsx
├── public/
├── next.config.js
├── package.json
└── tsconfig.json注意事项
[!warning] 重要提示
echo "N" \|用于自动回答脚本中的交互提示--app和--pages是互斥的,只能选择一个--import-alias的值会被写入tsconfig.json- 使用
--use-pnpm前确保已安装 pnpm
Turbopack 说明
Turbopack 是 Next.js 的新打包工具,目前处于 beta 阶段。
bash
# 启用 Turbopack
echo "Y" | npx create-next-app@latest my-app --use-pnpm
# 或者在开发时使用
pnpm dev --turbo相关命令
bash
# 安装 pnpm(如果未安装)
npm install -g pnpm
# 进入项目目录
cd ralph-auth-demo
# 安装依赖
pnpm install
# 启动开发服务器
pnpm dev
# 构建生产版本
pnpm build
# 启动生产服务器
pnpm start分享: