---
title: "安装"
description: "使用我们的在线启动器快速开始使用 Nuxt，或者从本地终端启动。"
canonical_url: "https://nuxt.zhcndoc.com/docs/3.x/getting-started/installation"
---
# 安装

> 使用我们的在线启动器快速开始使用 Nuxt，或者从本地终端启动。

## 在线体验

如果你只是想在浏览器中把玩 Nuxt，而不想先搭建项目，可以使用这个在线沙盒：

::card-group
  :::card
  ```yaml [props]
  title: 在 StackBlitz 中打开
  color: info
  icon: i-simple-icons-stackblitz
  to: https://stackblitz.com/github/nuxt/starter/tree/v3?file=app.vue
  target: _blank
  ```
  带有代码编辑器和终端访问权限的在线游乐场。
  :::
::

## 新项目

::steps
### 前提条件

- **Node.js** - [`22.x`](https://nodejs.org/en) 或更新版本（但我们推荐使用 [当前 LTS 版本](https://github.com/nodejs/release#release-schedule)）
- **文本编辑器** - 虽然没有 IDE 要求，但我们推荐使用 [Visual Studio Code](https://code.visualstudio.com/) 搭配 [官方 Vue 扩展](https://marketplace.visualstudio.com/items?itemName=Vue.volar)（以前称为 Volar）或 [WebStorm](https://www.jetbrains.com/webstorm/)，它与 [其他 JetBrains IDE](https://www.jetbrains.com/ides/) 一起，开箱即用就能提供出色的 Nuxt 支持。如果你使用其他编辑器，例如 Neovim，可以按照 [Vue Language Tools 安装指南](https://github.com/vuejs/language-tools/wiki) 配置 [Vue Language Server](https://github.com/vuejs/language-tools) 支持。
- **终端** - 用于运行 Nuxt 命令

:::callout
  ::::collapsible{name="最佳设置的额外说明"}
  - **Node.js**：请确保使用偶数版本（22、24 等）
  - **Neovim**：配置 Vue TypeScript 插件时，请确保 `location` 指向 `@vue/language-server` 包目录，而不是其二进制文件。有关可用配置，请参阅 [Neovim 安装指南](https://github.com/vuejs/language-tools/wiki/Neovim)。
  - **WSL**：如果你在 Windows 上并遇到 HMR 较慢的问题，可以尝试使用 [WSL（Windows Subsystem for Linux）](https://learn.microsoft.com/en-us/windows/wsl/install)，它可能会解决一些性能问题。
  - **Windows 上 DNS 解析缓慢**：在 Windows 上的本地开发服务器中，不要使用 `localhost:3000`，改用 `127.0.0.1`，这样浏览器加载会快得多。
  ::::
:::

### 创建新项目

打开一个终端（如果你使用 [Visual Studio Code](https://code.visualstudio.com)，可以打开 [集成终端](https://code.visualstudio.com/docs/terminal/basics)），并使用以下命令创建一个新的启动项目：

  :::code-group{sync="pm"}
  ```bash [npm]
  npm create nuxt@latest <project-name> -- -t v3
  ```

  ```bash [yarn]
  yarn create nuxt <project-name> -t v3
  ```

  ```bash [pnpm]
  pnpm create nuxt@latest <project-name> -t v3
  ```

  ```bash [bun]
  # 当 https://github.com/oven-sh/bun/issues/29087 解决后，你可以使用这个命令
  # bun create nuxt@latest <project-name> -t v3
  bunx create-nuxt@latest init <project-name> -t v3
  ```

  ```bash [deno]
  deno -A npm:create-nuxt@latest <project-name> -t v3
  ```
  :::

在 Visual Studio Code 中打开你的项目文件夹：

```bash [终端]
code <project-name>
```

或者从终端切换到你的新项目目录：

```bash
cd <project-name>
```

### 开发服务器

现在你可以启动 Nuxt 应用的开发模式：

  :::code-group{sync="pm"}
  ```bash [npm]
  npm run dev -- -o
  ```

  ```bash [yarn]
  yarn dev --open
  ```

  ```bash [pnpm]
  pnpm dev -o
  ```

  ```bash [bun]
  bun run dev -o

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

  ```bash [deno]
  deno run dev -o
  ```
  :::

  :::tip{icon="i-lucide-circle-check"}
  干得好！浏览器窗口应该会自动打开并访问 <http://localhost:3000>。
  :::
::

## 下一步

既然你已经创建了 Nuxt 项目，就可以开始构建你的应用了。

::read-more{title="Nuxt 概念" to="https://nuxt.zhcndoc.com/docs/3.x/guide/concepts"}
::


## Sitemap

See the full [sitemap](https://nuxt.zhcndoc.com/sitemap.md) for all pages.