vue-cli4如何打包靜態(tài)資源到指定目錄
打包靜態(tài)資源到指定目錄
在最近開(kāi)發(fā)工作中,我打包的 dist 文件夾下,vue-cli4 打包(npm run build)的靜態(tài)資源全部都平鋪展開(kāi)在該文件夾下,看著很別扭,于是想打包到 static 文件夾下。
vue-cli4 執(zhí)行打包命令時(shí),默認(rèn)打包的位置是dist文件夾下,不會(huì)自動(dòng)打包為一個(gè)模塊(文件夾)。
解決
在 vue.config.js 文件中設(shè)置 assetsDir 指定打包的目錄為根目錄下的 static 文件夾,就會(huì)在 dist 文件夾下自動(dòng)生成一個(gè)新的文件夾 static 來(lái)存放打包的靜態(tài)資源。
設(shè)置之后打包的文件目錄為:
說(shuō)明:文件夾下的 js 和 json 文件夾是我寫在 public 文件夾下的模塊用于 axios 請(qǐng)求本地?cái)?shù)據(jù),打包時(shí)會(huì)直接打包到 dist 文件夾下。
vue-cli打包訪問(wèn)靜態(tài)資源404
使用vue-cli生產(chǎn)打包,把代碼放到服務(wù)器上訪問(wèn)的時(shí)候,不少同學(xué)會(huì)看到頁(yè)面一片空白,打開(kāi)控制臺(tái),會(huì)發(fā)現(xiàn)是某些資源文件找不到,如圖:
其實(shí)這里是因?yàn)関ue-cli的webpack打包配置靜態(tài)文件訪問(wèn)路徑不對(duì),配置文件路徑如圖:
在這個(gè)文件下面找到生產(chǎn)(build)配置:
要解決靜態(tài)文件訪問(wèn)路徑問(wèn)題只需要修改配置中的assetsPublicPath字段即可。
如果你的服務(wù)器靜態(tài)文件路徑是這樣的:
將路徑寫成這樣即可訪問(wèn)靜態(tài)資源:
資源訪問(wèn)成功狀態(tài):
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
淺析Vue3中通過(guò)v-model實(shí)現(xiàn)父子組件的雙向數(shù)據(jù)綁定及利用computed簡(jiǎn)化父子組件雙向綁定
這篇文章主要介紹了淺析Vue3中通過(guò)v-model實(shí)現(xiàn)父子組件的雙向數(shù)據(jù)綁定及利用computed簡(jiǎn)化父子組件雙向綁定,需要的朋友可以參考下2022-12-12vue element-ui里的table中表頭與表格出現(xiàn)錯(cuò)位的解決
這篇文章主要介紹了vue element-ui里的table中表頭與表格出現(xiàn)錯(cuò)位的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-08-08Vue整合Node.js直連Mysql數(shù)據(jù)庫(kù)進(jìn)行CURD操作過(guò)程詳解
這篇文章主要給大家分享Vue整合Node.js,直連Mysql數(shù)據(jù)庫(kù)進(jìn)行CURD操作的詳細(xì)過(guò)程,文中有詳細(xì)的代碼講解,具有一定的參考價(jià)值,需要的朋友可以參考下2023-07-07Vue常見(jiàn)報(bào)錯(cuò)以及解決方案實(shí)例總結(jié)
最近做了一個(gè)比較老的vue項(xiàng)目,啟動(dòng)居然各種報(bào)錯(cuò),下面這篇文章主要給大家介紹了關(guān)于Vue常見(jiàn)報(bào)錯(cuò)以及解決方案的相關(guān)資料,文中通過(guò)圖文介紹的非常詳細(xì),需要的朋友可以參考下2022-07-07vue調(diào)試工具vue-devtools安裝及使用方法
本文主要介紹 vue的調(diào)試工具 vue-devtools 的安裝和使用,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2018-11-11vue中使用elementui實(shí)現(xiàn)樹(shù)組件tree右鍵增刪改功能
這篇文章主要介紹了vue中使用elementui實(shí)現(xiàn)對(duì)樹(shù)組件tree右鍵增刪改功能,右擊節(jié)點(diǎn)可進(jìn)行增刪改,對(duì)節(jié)點(diǎn)數(shù)據(jù)進(jìn)行模糊查詢功能,本文給大家分享了完整代碼,需要的朋友可以參考下2022-08-08