詳解vue項(xiàng)目打包步驟
更新時(shí)間：2019年03月29日 14:12:30 作者：YJC5431
這篇文章主要介紹了vue項(xiàng)目打包步驟，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
終端運(yùn)行命令 npm run build
打包成功的標(biāo)志與項(xiàng)目的改變，如下圖：
點(diǎn)擊index.html，通過(guò)瀏覽器運(yùn)行，出現(xiàn)以下報(bào)錯(cuò)，如圖：
那么應(yīng)該如何修改呢？
具體步驟如下：
- 1、查看package.js文件的scripts命令
- 2、打開(kāi)webpack.dev.conf.js文件，找到publicPath: config.dev.assetsPublicPath,按Ctrl點(diǎn)擊，跳轉(zhuǎn)到index.js文件
- 3、其中dev是開(kāi)發(fā)環(huán)境，build是構(gòu)建版本，找到build下面的assetsPublicPath: '/',然后修改為assetsPublicPath: './',即“/”前加點(diǎn)。
- 4、終端運(yùn)行 npm run build 即可。
此時(shí)點(diǎn)擊index.html，通過(guò)瀏覽器運(yùn)行便，會(huì)發(fā)現(xiàn)動(dòng)態(tài)綁定的static的圖片找不到，故static必須使用絕對(duì)路徑。將圖片路徑修改為絕對(duì)路徑，至此，打包完成。
以上所述是小編給大家介紹的vue項(xiàng)目打包步驟詳解整合，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要為大家介紹了Vue之組件的自定義事件，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助2021-11-11
Vue組件高級(jí)通訊之$children與$parent
這篇文章主要為大家介紹了Vue組件高級(jí)通訊之$children與$parent，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
Vuex 是一個(gè)專為 Vue.js 應(yīng)用程序開(kāi)發(fā)的狀態(tài)管理模式，本文給大家分享Vue3.0中快速上手Vuex狀態(tài)管理的方式，本文通過(guò)實(shí)例代碼講解的很詳細(xì)，對(duì)大家學(xué)習(xí)Vuex狀態(tài)管理相關(guān)知識(shí)有很大的幫助，感興趣的朋友一起學(xué)習(xí)吧2021-05-05
淺談Vue開(kāi)發(fā)人員的7個(gè)最好的VSCode擴(kuò)展
這篇文章主要介紹了淺談Vue開(kāi)發(fā)人員的7個(gè)最好的VSCode擴(kuò)展，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01
vue封裝一個(gè)右鍵菜單組件詳解(復(fù)制粘貼即可使用)
關(guān)于vue項(xiàng)目中會(huì)出現(xiàn)一些需求,就是右鍵菜單項(xiàng)的功能實(shí)現(xiàn),下面這篇文章主要給大家介紹了關(guān)于vue封裝一個(gè)右鍵菜單組件(復(fù)制粘貼即可使用)的相關(guān)資料,需要的朋友可以參考下2022-12-12
Vue實(shí)現(xiàn)數(shù)據(jù)表格合并列rowspan效果
這篇文章主要為大家詳細(xì)介紹了Vue實(shí)現(xiàn)數(shù)據(jù)表格合并列rowspan效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-07-07
這篇文章主要介紹了Vue祖孫組件如何實(shí)現(xiàn)傳值問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-03-03
這篇文章主要介紹了vue異步加載高德地圖的實(shí)現(xiàn)，詳細(xì)的介紹了異步加載的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-06-06
這篇文章主要介紹了Vue中的計(jì)算屬性,模板內(nèi)的表達(dá)式,用于簡(jiǎn)單運(yùn)算,但是模板中放入太多的邏輯會(huì)讓模板過(guò)重且難以維護(hù)，更多具體內(nèi)容一起進(jìn)入下面文章學(xué)習(xí)吧,需要的朋友也可以參考一下2021-12-12
Vue過(guò)濾器,生命周期函數(shù)和vue-resource簡(jiǎn)單介紹
這篇文章主要介紹了Vue過(guò)濾器,生命周期函數(shù)和vue-resource簡(jiǎn)單介紹，幫助大家更好的理解和使用vue，感興趣的朋友可以了解下2021-01-01