安装
通过我们的在线起步项目快速上手 Nuxt,或者在本地终端中开始。
在线体验
如果你只想在浏览器中体验 Nuxt 而无需设置项目,可以使用这个在线沙盒
新建项目
前提条件
- Node.js -
22.x或更新版本(但我们推荐 active LTS 版本) - 文本编辑器 - 对 IDE 没有硬性要求,但我们推荐使用带有 官方 Vue 扩展(原名 Volar)的 Visual Studio Code 或 WebStorm,它与 其他 JetBrains IDE 一起,开箱即提供对 Nuxt 的绝佳支持。如果你使用其他编辑器(例如 Neovim),可以按照 Vue Language Tools 设置指南 配置 Vue Language Server 支持。
- 终端 - 为了运行 Nuxt 命令
- Node.js:确保使用偶数版本(22、24 等)
- Neovim:配置 Vue TypeScript 插件时,确保
location指向@vue/language-server软件包目录,而不是其二进制文件。有关可用的配置,请参阅 Neovim 设置指南。 - WSL:如果你使用的是 Windows 并且遇到 HMR 缓慢的问题,可以尝试使用 WSL (Windows Subsystem for Linux),这可能会解决一些性能问题。
- Windows DNS 解析缓慢:在 Windows 上运行本地开发服务器时,建议不要使用
localhost:3000,而是使用127.0.0.1,这样可以在浏览器中获得快得多的加载体验。
创建新项目
打开终端(如果你使用的是 Visual Studio Code,可以打开一个 集成终端)并使用以下命令创建一个新的起步项目
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
# To use the Bun runtime during development
# bun --bun run dev -o
deno run dev -o
干得漂亮!浏览器窗口应该会自动打开 https://:3000。
如果你正在使用 Docker 或者希望在多台机器间保持一致的开发环境,可以考虑使用开发容器。了解有关开发容器的更多信息
后续步骤
既然你已经创建了 Nuxt 项目,现在就可以开始构建你的应用程序了。