zoukankan      html  css  js  c++  java
  • Vue项目部署在IIS

    一、方式一 将vue发布到一个单独的网站上

    发布vue项目,生成dist文件夹

    打开iis服务器后选中【网站】后右击选【添加网站】,物理路径指向发布生成的dist文件夹

    到此项目就部署好了,点击右侧浏览即可打开网站

     你以为部署完成就可以了,遇到的问题才刚开始


      

     没错,开发环境下没问题的项目,在通过以上发布部署后报错了,先归纳了下出现的错误:

    1、提示Vue is not  defined,如下截图

     2、提示Unexpected token <,如下图

    3、经过网上的各种解决方式终于摆脱了有些错误,打开了网站,但是刷新页面,却报404.。。。。。如下图

      

     先说说我在网上找的解决方式吧,为了解决Vue is not  defined,我对项目代码做了调整,包括资源的引用方式、路由的调整和mode:history改为了mode:hash等等吧,每次都会引出其他错误。后来遇到IIS中开启代理和设置URL重写的方式来解决,一一做了尝试,发现还是报错Unexpected token <,首先可以确定不是代码的问题。总之肺疼


    还好,还好最终找到了解决我问题的方式

    总体来说就是在IIS正常部署完vue项目上之后,需要对URL重定向,原因是vue是根据vue-router转发路由访问url,在这里我们应该进行url rewrite。url write的方式有两种

    1、在iis下载url rewrite工具配置规则

    上边说过我尝试过该方式,也下载了所需模块:urlrewrite,可能配置的有问题,反正就是报错,如果能正确配置应该是没问题的

    2、配置web.config文件

    最终我使用了该方式,简单方便,和使用URL重写原理是一样的

    web.config的内容:

    <?xml version="1.0" encoding="UTF-8"?>
    <configuration>
     <system.webServer>
     <staticContent>
      <remove fileExtension=".woff" />
      <mimeMap fileExtension=".woff" mimeType="font/x-woff" />
      <remove fileExtension=".woff2" />
      <mimeMap fileExtension=".woff2" mimeType="font/x-woff2" />
      <remove fileExtension=".ttf" />
      <mimeMap fileExtension=".ttf" mimeType="font/x-ttf" />
      <remove fileExtension=".json" />
      <mimeMap fileExtension=".json" mimeType="text/json" />
     </staticContent>
     <rewrite>
      <rules>
      <rule name="vue" stopProcessing="true">
       <match url=".*" />
       <conditions logicalGrouping="MatchAll">
       <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
       <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
       </conditions>
       <action type="Rewrite" url="/" />
      </rule>
      </rules>
     </rewrite>
     </system.webServer>
    </configuration>

    将该文件拷贝到打包好根目录下面

     然后发现网站OK了


    二、通过添加应用程序进行部署

    除了以上方式之外,还有另一种方式在IIS部署VUE项目,方便简洁,不会出现以上的各种问题。即新建一个网站,在该网站下,添加应用程序或者添加虚拟目录,具体有时间在描述下

  • 相关阅读:
    浅谈随机化算法
    SPSS问题
    羽毛球技术
    三大线性排序之桶排序
    Java产生随机数
    Java堆栈详解
    三大线性排序之基数排序
    指针 和 数组
    复制构造函数 与 赋值函数 的区别
    【c++】类中的const成员
  • 原文地址:https://www.cnblogs.com/qtiger/p/13631372.html
Copyright © 2011-2022 走看看