vue项目部署到IIS
创始人
2024-06-01 06:16:46

项目打包

vue 部署包:
项目路径运行npm run build
vue项目打包

运行后生成一个dist文件夹,把这个文件夹放到要部署的服务器
在这里插入图片描述

IIS 配置

程序

需要用到下面这两个程序进行配置:
程序
如果 IIS 没有 Web平台安装程序(上图管理模块第二个),可以进行手动下载:

  • URL重写
  • application request routing

新建站点

网站(右键)——添加站点
在这里插入图片描述
以 test 为例:
例子

访问站点

点击浏览网站下方超链接或者浏览器输入http://localhost:9999
在这里插入图片描述

出现的问题

IE 浏览器下会空白

一开始服务器只有 IE浏览器,打开会是空白页,控制台会报错chunk....,安装了babel-polyfill也不行,最后在谷歌浏览器打开可以
(所以建议不要用IE浏览器打开)

页面 404

报错图片

项目路由没错的情况下,需要设置 URL重写:
双击 test 的 URL 重写——右上角的添加规则——空白规则
在这里插入图片描述
名称:自定义
模式:.*
条件:添加——选择不是文件
操作属性:重写URL——/index.html
在这里插入图片描述
在这里插入图片描述

接口405

(下述场景为前端与后台在同一服务器下进行配置的)
假设后台接口地址为:http://localhost:9001/api/…
需要设置代理

  • Application Request Routing设置:
    双击程序——Server Proxy Settings.(右下角)——选中Enable proxy
    在这里插入图片描述

  • 项目vue.config.js设置代理
    在这里插入图片描述
    axios 封装:baseURL设置为/api
    在这里插入图片描述

  • 设置 URL 重写
    添加空白规则(同上)
    模式:*api/*
    重写URL:http://localhost:9001/api/{R:2}(以上述后台接口为例)
    在这里插入图片描述

相关内容

热门资讯

永和大王母公司国际业务或转上港... 2026年1月,菲律宾餐饮企业快乐蜂食品集团(以下简称“快乐蜂”)宣布分拆包括中国业务在内的所有国际...
上市公司密集启动增持回购 【#上市公司密集启动增持回购#】#百亿护盘资金将涌入A股#沪指在4100点拉锯之际,A股公司开启了新...
“米克拉”将继续加强,23日夜... 据中央气象台消息,今年第7号台风“米克拉”今天(21日)下午加强为台风级,下午5点钟其中心位于台湾鹅...
新民艺评|梁天明:心若无迷,何... (来源:上观新闻)由邢键钧、路云飞执导,余耕编剧,郭京飞、任素汐领衔主演的现实悬疑剧《迷墙》,于近日...
美伊谈判在即,以色列在背后“使... 转自:新华国际头条据以色列媒体21日报道,以色列国防部长卡茨说,过去和现在,以军在黎巴嫩境内“消除威...