安装
通过在线 starter 快速上手 Nuxt,或在本地使用终端从零开始。
在线体验(Play Online)
如果你只是想在浏览器里体验 Nuxt 而不想搭建项目,可以使用这个在线沙箱:
新建项目(New Project)
前置条件(Prerequisites)
- Node.js -
22.x或更新版本(但我们推荐使用活跃 LTS 版本) - 文本编辑器 - 没有固定的 IDE 要求,但我们推荐使用 Visual Studio Code 并安装官方 Vue 扩展(前身为 Volar),或者 WebStorm,它与其他 JetBrains IDE 一样开箱即可提供出色的 Nuxt 支持。如果你使用其他编辑器,例如 Neovim,可以按照 Vue Language Tools 设置指南 配置 Vue Language Server 支持。
- 终端(Terminal) - 用于运行 Nuxt 命令
- Node.js:请使用偶数版本(22、24 等)。
- Neovim:配置 Vue TypeScript 插件时,请确保
location指向@vue/language-server包目录,而不是它的二进制文件。可参考 Neovim 设置指南 获取可用配置。 - WSL:如果你在 Windows 上遇到 HMR 缓慢的问题,可以尝试使用 WSL(Windows 子系统 for Linux),它可能解决一些性能问题。
- Windows 下 DNS 解析缓慢:在 Windows 上本地开发时,不要使用
localhost:3000,改用127.0.0.1可以获得快得多的浏览器加载体验。
创建新项目(Create a New Project)
打开终端(如果你使用 Visual Studio Code,可以打开集成终端),并使用以下命令创建一个全新的 starter 项目: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 中打开你的项目文件夹:
Terminal
code <project-name>
或者在终端中切换到你的新项目目录:
cd <project-name>
开发服务器(Development Server)
现在你可以以开发模式启动 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)。了解更多关于开发容器的内容
:::
下一步(Next Steps)
既然你已经创建了 Nuxt 项目,就可以开始构建你的应用了。
Nuxt 概念(Nuxt Concepts)·阅读更多