创建 Vue.js 应用程序

在这个 5-10 分钟的 Visual Studio 集成开发环境 (IDE) 简介中，你可以创建并运行简单的 Vue.js 前端 Web 应用程序。

先决条件

确保安装以下内容：

• Visual Studio 2022 或更高版本。 请转到 Visual Studio 下载页，进行免费安装。
• npm (https://www.npmjs.com/)，随 Node.js 提供
• Vue.js (Installation | Vue.js (vuejs.org))

创建应用

1. 在“开始”窗口中（选择“文件”>“开始窗口”并打开），选择“新建项目”。

   

2. 在顶部的搜索栏中搜索“Vue”，然后根据偏好选择“独立 JavaScript Vue 项目”或“独立 TypeScript Vue 项目”。

   

3. 为项目和解决方案命名，然后选择“下一步”。

4. 选择“创建”，然后等待 Visual Studio 创建项目。

查看项目属性

使用默认项目设置可以生成和调试项目。 但是，如果需要更改设置，请右键单击解决方案资源管理器中的项目，选择“属性”，然后转到“生成”或“调试”部分。

注意

launch.json 存储与“调试”工具栏中的“开始”按钮关联的启动设置。 目前，launch.json 必须位于 .vscode 文件夹下。

生成项目

选择“生成”>“生成解决方案”以生成项目 。

启动项目

按 F5 或选择窗口顶部的“开始”按钮，你将看到命令提示，例如：

• VITE v4.4.9 在 780 毫秒内准备就绪

  注意

  检查消息的控制台输出，例如指示你更新 Node.js 版本的消息。

接下来，你会看到基本 Vue.js 应用！

后续步骤

对于 ASP.NET Core 集成：

使用 Vue 创建 ASP.NET Core 应用