這篇文章介紹了解決VUE項(xiàng)目在IIS部署出現(xiàn)：Uncaught SyntaxError: Unexpected token ＜報(bào)錯(cuò)的方法，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

一、第一個(gè)解決方法是把mode改成history這個(gè)問題就會(huì)消失

二、第二個(gè)解決方法是publicPath設(shè)置成’/’,不能是’./’

const publicPath='';
module.exports = {
  // publicPath: process.env.NODE_ENV === 'production' ? '/lucky-draw' : '/'
  publicPath: `/${publicPath}`
};

三、報(bào)錯(cuò)404 Not Found,請重寫url

在IIS正常部署完vue項(xiàng)目上之后，需要對URL重定向，原因是vue是根據(jù)vue-router轉(zhuǎn)發(fā)路由訪問url，在這里我們應(yīng)該進(jìn)行url rewrite。url write的方式有兩種

1、在iis下載url rewrite工具配置規(guī)則

下載所需模塊：urlrewrite

2、配置web.config文件

最終我使用了該方式，簡單方便，和使用URL重寫原理是一樣的

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>

將該文件拷貝到打包好根目錄下面

到此這篇關(guān)于解決VUE項(xiàng)目在IIS部署出現(xiàn)：Uncaught SyntaxError: Unexpected token ＜報(bào)錯(cuò)的文章就介紹到這了。希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

vue實(shí)現(xiàn)進(jìn)入某個(gè)頁面后替換地址欄路徑的操作方法
vue頁面在實(shí)際開發(fā)中,經(jīng)常會(huì)遇到改變url參數(shù),重新加載頁面數(shù)據(jù)的需求,但是只改變頁面url并不會(huì)觸發(fā)組件的生命周期,這就需要用其他方法來實(shí)現(xiàn)了,本文重點(diǎn)介紹vue實(shí)現(xiàn)進(jìn)入某個(gè)頁面后替換地址欄路徑的操作方法,感興趣的朋友跟隨小編一起看看吧
2024-04-04
Vue 解決在element中使用$notify在提示信息中換行問題
這篇文章主要介紹了Vue 解決在element中使用$notify在提示信息中換行問題，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧
2020-11-11
解決ant-design-vue安裝報(bào)錯(cuò)的問題
這篇文章主要介紹了解決ant-design-vue安裝報(bào)錯(cuò)的問題，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-12-12
對vue生命周期的深入理解
這篇文章主要給大家介紹了關(guān)于對vue生命周期的深入理解，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2020-12-12
vue實(shí)現(xiàn)單選和多選功能
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)單選和多選功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-08-08
vue3+vite+TS中使用element-plus按需引入ElLoading、ElMessage樣式失效解決
在項(xiàng)目中使用elementui確實(shí)是很方便的一件事,下面這篇文章主要給大家介紹了關(guān)于vue3+vite+TS中使用element-plus按需引入ElLoading、ElMessage樣式失效解決的相關(guān)資料,需要的朋友可以參考下
2023-02-02
Vue 事件處理操作實(shí)例詳解
這篇文章主要介紹了Vue 事件處理操作,結(jié)合實(shí)例形式較為詳細(xì)的分析了vue.js事件處理相關(guān)的事件監(jiān)聽、處理、修飾符等相關(guān)概念、用法及操作注意事項(xiàng),需要的朋友可以參考下
2019-03-03
vue中父子組件相互傳值的實(shí)現(xiàn)方法詳解
父子組件通信是Vue中常見的場景,這篇文章主要為大家詳細(xì)介紹了vue中父子組件相互傳值的實(shí)現(xiàn)方法,文中的示例代碼講解詳細(xì),需要的小伙伴可以參考一下
2023-12-12
Vue中$on和$emit的實(shí)現(xiàn)原理分析
這篇文章主要介紹了Vue中$on和$emit的實(shí)現(xiàn)原理分析，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-05-05
vue-element如何實(shí)現(xiàn)動(dòng)態(tài)換膚存儲(chǔ)
這篇文章主要介紹了vue-element如何實(shí)現(xiàn)動(dòng)態(tài)換膚存儲(chǔ)問題，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-04-04