VS2022中.Net Api + Vue 从创建到发布到IIS

VS2022中.Net Api + Vue 从创建到发布到IIS

前言

最近从VS2019 升级到了VS2022,终于可以使用官方的.Net + Vue 组合了,但是使用过程中还是有很多问题,这里记录一下.

一、先决条件

Visual Studio的安装内容,首选确保Visual Studio是2022版本及以上,安装部门选择ASP.NET和Web开发选项与 Node.js开发.

二、创建项目

准备好上面的内容后在创建的项目的地方搜索Vue and ASP.NET Core:

我这里命名为VueAndNetTest,后面配置直接默认即可

三、运行项目

创建好项目后可以看到解决方案里面有两个项目,一个是.Net的为服务端,Vue的为客户端,毕竟是个前后端分离的项目.

到这里就已经可以直接运行项目了,会有两个命令符窗口弹出来,一个是Vue的运行另一个是.Net Core的运行.

准备好后则会打开两个网页,注意都不要关闭否则要重新运行项目了.

还有一个Swagger的API管理界面,可以在这里测试API.

四、增加API

到这里已经可以正常开发了,这里再举个列子说明如何增加自定义的Controller与API.

  1. 右键Controllers文件夹,然后添加Controller,我这里添加一个HomeController.cs

    新增的Controller是不会被检测到的,需要增加注解
javascript 复制代码
using Microsoft.AspNetCore.Mvc;

namespace VueAndNetTest.Server.Controllers
{
    [ApiController]
    [Route("[controller]")]
    public class HomeController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }
    }
}

五、发布到IIS

在上述设置之后就可以发布项目了,右击.Net项目,我这里是发布到文件夹然后手动发布到IIS中,首先右击项目,然后点击发布,选择文件夹,接下来默认就可以了.

这里也可以改成自己想保存的目录

点击保存,等发布后会出现这个界面,然后再点击发布按钮,下次发布直接点击发布就可以了

这是发布完后的文件夹内容

接下来是IIS的设置

先确认一点是使用单独的端口号还是使用默认的,如果使用默认的则需要一个名称用于访问,在这里我发布到默认端口.

  1. 首先在IIS添加一个应用程序VueAndNetTest
  2. 别名就是应用程序名称VueAndNetTest,物理路径选择刚刚发布的路径
  3. 点击确定后则发布成功可以成功访问网站了

接下来你会发现你的网站还是白色的,那么就对了

因为这里是使用默认的设置的网站名称为VueAndNetTest,所以需要设置一下

六、设置Vue的发布

首先找到文件vite.config.js,在defineConfig中添加内容

复制代码
base: '/VueAndNetTest/',

这样设置后就可以正常访问了

相关推荐
ConardLi1 分钟前
要给大家泼盆冷水了,使用 MCP 绝对不容忽视的一个问题!
前端·人工智能·后端
一袋米扛几楼981 小时前
【前端】从零开始的搭建顺序指南(技术栈:Node.js + Express + MongoDB + React)book-management
前端·node.js·express
yzhSWJ1 小时前
CSS Position 属性完全指南
前端·css
xcLeigh1 小时前
HTML5好看的水果蔬菜在线商城网站源码系列模板7
前端·html·html5
非凡网站2 小时前
企业网站html源代码 企业网站管理源码模板
前端·html
brzhang2 小时前
接口又乱又难用?老司机带你掌握 8 个 API 设计绝招,告别低效协作!
前端·后端·架构
brzhang2 小时前
搞懂 HTTP/1、HTTP/2、HTTP/3:让你的 Web 应用快如闪电,面试不再怕!
前端·后端·架构
码观天工2 小时前
.NET AI Preview 2 发布:从 .NET Aspire 支持到 Qdrant 向量数据库集成,助你快速构建云原生 AI 应用
ai·c#·.net·向量数据库·aspire·qdrant
时光追逐者2 小时前
C#/.NET/.NET Core技术前沿周刊 | 第 36 期(2025年4.21-4.27)
c#·.net·.netcore