解決vue-cli3 使用子目錄部署問(wèn)題
在使用 vue-cli3 build的時(shí)候，使用非子目錄需要在 vue.config.js 中添加如下代碼：
module.exports = {
baseUrl: process.env.NODE_ENV === 'production' ? '/dist/' : '/',
}
但是build完后，放在nginx服務(wù)下，會(huì)看到如下報(bào)錯(cuò)，頁(yè)面也顯示 no-script 的內(nèi)容
[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.
網(wǎng)上找了很多，并沒(méi)有找到答案。后來(lái)發(fā)現(xiàn) vue-router 是用了 history 模式，但是 nginx 并沒(méi)有添加相應(yīng)的配置便會(huì)出現(xiàn)這個(gè)問(wèn)題。所以，如下解決方案：
1.變更生產(chǎn)環(huán)境配置，使得支持 history 模式。這里只需要修改 nginx 的配置，把 404 指向 index.html 即可。
2.不在使用history模式
總結(jié)
以上所述是小編給大家介紹的vue-cli3 使用子目錄部署問(wèn)題，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
vue-admin如何實(shí)現(xiàn)動(dòng)態(tài)路由
這篇文章主要介紹了vue-admin如何實(shí)現(xiàn)動(dòng)態(tài)路由問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-07-07
這篇文章主要介紹了Vue的props父?jìng)髯拥氖纠a，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-05-05
這篇文章介紹了vue使用Vuex狀態(tài)管理模式的方法，文中通過(guò)示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-04-04
前端啟動(dòng)出現(xiàn)報(bào)錯(cuò)提示vue-cli-service?serve的原因及解決辦法
這篇文章主要給大家介紹了關(guān)于前端啟動(dòng)出現(xiàn)報(bào)錯(cuò)提示vue-cli-service?serve的原因及解決辦法,文中通過(guò)圖文以及實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-11-11
在Vue開(kāi)發(fā)中使用:style綁定樣式是常見(jiàn)需求,應(yīng)注意:class與:style的配合使用,錯(cuò)誤的使用可能導(dǎo)致樣式不生效,正確的方法是使用數(shù)組綁定多個(gè)樣式,這些技巧有助于提高開(kāi)發(fā)效率和保持代碼整潔,感興趣的朋友跟隨小編一起看看吧2024-09-09
vue-cli3配置favicon.ico和title的流程
這篇文章主要介紹了vue-cli3配置favicon.ico和title的流程，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-10-10
vue使用el-upload上傳文件及Feign服務(wù)間傳遞文件的方法
這篇文章主要介紹了vue使用el-upload上傳文件及Feign服務(wù)間傳遞文件的方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-03-03
vscode 插件開(kāi)發(fā) + vue的操作方法
這篇文章主要介紹了vscode 插件開(kāi)發(fā) + vue的操作方法，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-06-06
這篇文章主要為大家詳細(xì)介紹了Vue.js下拉菜單組件的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-10-10
vscode+vue cli3.0創(chuàng)建項(xiàng)目配置Prettier+eslint方式
這篇文章主要介紹了vscode+vue cli3.0創(chuàng)建項(xiàng)目配置Prettier+eslint方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10