axios請求本地的json文件在打包部署到子目錄域名下,路徑找不到

前言:css

  由於要同時部署兩個項目,有一個是部署到域名下面的子目錄下,如:https://xxx.com/siot-adminvue

  vue 項目中使用axios請求了本地項目的static文件夾下的json文件,使用npm run build 打包後,json文件請求不到報404:webpack

  

  

解決辦法:      ios

Vue-cli打包後部署到子目錄下路徑問題

舉例,若須要部署到www.***.com/catalog1/catalog2/下,須要更改web

  1. config/index.js文件中,buildassetsPublicPath屬性爲'/catalog1/catalog2/',以下:npm

build: { assetsPublicPath: '/catalog1/catalog2/', 

  默認狀況下該值爲'/'(該屬性目測是webpack打包時的文件引用路徑的基礎路徑,一級域名下這裏應該寫成「./」)。json

  2.修改路由base屬性爲'/catalog1/catalog2/',以下:axios

export default new Router({ // mode: 'history',
   base: '/catalog1/catalog2/', //這個必定要加上 routes: [ { path: '/', name: 'indexContent', component: indexContent } ] })

其中mode設置爲'history'可清除路徑中的#(本地測試有效)。
設置完成後從新打包。測試

 

問題二: static裏面的 font字體在打包後也找不到了字體

這個字體文件報404

解決辦法:

在build/utils文件中的下圖所示位置添加../../公共路徑   

這樣打包的iconfont字體文件路徑時就會加上../../了。引用就沒問題了。而再也不須要手動更改css文件中的路徑。 

 

相關文章
相關標籤/搜索