Vue項(xiàng)目打包部署到iis服務(wù)器的配置方法
更新時(shí)間：2019年10月14日 15:01:06 作者：I like study.
這篇文章主要介紹了Vue項(xiàng)目打包部署到iis服務(wù)器的配置方法，文中通過代碼示例給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
一 將Vue項(xiàng)目打包
切換到項(xiàng)目目錄下，輸入cnpm run build 打包
等待打包完成
二 URL 重寫
訪問我們的一個(gè)url
原因是vue不是根據(jù)項(xiàng)目目錄的地址訪問的，是根據(jù)vue-router轉(zhuǎn)發(fā)路由訪問url，在這里我們應(yīng)該進(jìn)行url rewrite
url write的方式有兩種，一種是在iis下載url rewrite工具配置規(guī)則
另一種是配置web.config文件，我用的是第二種
web.config內(nèi)容
<?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>
將該文件拷貝到打包好根目錄下面
發(fā)現(xiàn)成功訪問到我們的url
總結(jié)
以上所述是小編給大家介紹的Vue項(xiàng)目打包部署到iis服務(wù)器的配置方法,希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
如果你覺得本文對你有幫助，歡迎轉(zhuǎn)載，煩請注明出處，謝謝！
相關(guān)文章
這篇文章主要給大家介紹了關(guān)于VUE3安裝element?ui失敗的原因以及解決的相關(guān)資料,很多朋友升級(jí)使用Vue3了,但在安裝element?ui失敗出錯(cuò)了,這里給大家總結(jié)下,需要的朋友可以參考下2023-09-09
vue3內(nèi)嵌iframe的傳參與接收參數(shù)代碼示例
這篇文章主要給大家介紹了關(guān)于vue3內(nèi)嵌iframe的傳參與接收參數(shù)的相關(guān)資料,Vue項(xiàng)目中使用iframe及傳值功能相信有不少人都遇到過,需要的朋友可以參考下2023-07-07
本文主要介紹了vite+vue3使用@路徑報(bào)錯(cuò)處理,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-11-11
在我們使用Vue開發(fā)時(shí),經(jīng)常會(huì)用到CSS,下面這篇文章主要給大家介紹了關(guān)于Css中該如何使用Vue變量的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-11-11
這篇文章主要介紹了vue-router的hooks用法,本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-06-06
基于Vue3實(shí)現(xiàn)旋轉(zhuǎn)木馬動(dòng)畫效果
這篇文章主要為大家介紹了如何利用Vue3實(shí)現(xiàn)旋轉(zhuǎn)木馬的動(dòng)畫效果，文中的示例代碼講解詳細(xì)，對我們學(xué)習(xí)Vue有一定的幫助，需要的可以參考一下2022-05-05
這篇文章主要給大家匯總介紹了Vue中fragment.js使用方法的相關(guān)資料,需要的朋友可以參考下2020-02-02
vue實(shí)現(xiàn)ajax滾動(dòng)下拉加載，同時(shí)具有l(wèi)oading效果(推薦)
這篇文章主要介紹了vue實(shí)現(xiàn)ajax滾動(dòng)下拉加載，同時(shí)具有l(wèi)oading效果的實(shí)現(xiàn)代碼，文章包括難點(diǎn)說明，介紹的非常詳細(xì)，感興趣的朋友參考下2017-01-01
這篇文章主要介紹了如何在?vue?中使用?svg?symbols，本文通過示例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-08-08
vue2.0基于vue-cli+element-ui制作樹形treeTable
這篇文章主要介紹了vue2.0基于vue-cli+element-ui制作樹形treeTable，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04