创建 Vue.js 应用程序

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

先决条件

确保安装以下内容:

创建应用

  1. 在“开始”窗口中(选择“文件”>“开始窗口”并打开),选择“新建项目”。

    Screenshot showing Create a new project

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

    Screenshot showing choosing a template

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

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

查看项目属性

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

注意

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

生成项目

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

启动项目

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

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

    注意

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

接下来,你会看到基本 Vue.js 应用!

后续步骤

对于 ASP.NET Core 集成: