安装

通过在线模板快速开始 Nuxt,或者在本地终端中创建项目。

在线体验

如果你只想在浏览器里试试 Nuxt,不想搭建项目,可以使用这个在线沙箱:

在线 playground,自带代码编辑器和终端。

新建项目

前置要求

  • Node.js:请使用偶数版本(22、24 等)
  • Neovim:配置 Vue TypeScript 插件时,确保 location 指向 @vue/language-server 包目录,而不是二进制文件。参考 Neovim 配置指南获取可用配置。
  • WSL:如果你在 Windows 上遇到 HMR 慢的问题,可以试试 WSL(Windows 子系统 Linux),可能会解决一些性能问题。
  • Windows DNS 解析慢:在 Windows 上做本地开发时,不要用 localhost:3000,改用 127.0.0.1,浏览器加载会快很多。

创建新项目

打开终端(如果你用 Visual Studio Code,可以打开内置终端),运行以下命令创建一个新的 Nuxt 项目:

npm create nuxt@latest <project-name>
yarn create nuxt <project-name>
pnpm create nuxt@latest <project-name>
bun create nuxt@latest <project-name>
deno -A npm:create-nuxt@latest <project-name>

在 Visual Studio Code 中打开项目文件夹:

code <project-name>

或者在终端中进入项目目录:

cd <project-name>

启动开发服务器

现在你可以用开发模式启动 Nuxt 应用了:

npm run dev -- -o
yarn dev --open
pnpm dev -o
bun run dev -o

# 开发时使用 Bun 运行时
# bun --bun run dev -o
deno run dev -o

搞定!浏览器应该会自动打开 http://localhost:3000。

如果你在用 Docker,或者需要在不同机器间保持一致的开发环境,可以考虑使用 dev container。了解更多关于 dev containers。

下一步

项目创建好了,你可以开始开发应用了。