vue打包到伺服器,頁面顯示空白
此篇講解下這個報錯問題,這個坑花費了一天時間才解決,好氣呀~
vue專案本地執行npm run dev沒問題,但在打包完npm run build伺服器上執行頁面一片空白,指出來最外層的div,一開始以為是路由的寫法有問題,換了種方式寫還是不行,各種方法試變沒用,崩潰~
最後還是同事發現問題,原來是在打包的時候,少了個配置檔案,我的天。
在dist/index.html里加了個js檔案,如下圖:
好吧,伺服器上終於顯示正常了。這是我遇到的問題解決方法,如有相同問題可作為參考。
假如配置完成後還有404報錯,請參照這個連結(轉載的):
https://www.cnblogs.com/kevingrace/p/6126762.html
相關推薦
vue打包到伺服器,頁面顯示空白
此篇講解下這個報錯問題,這個坑花費了一天時間才解決,好氣呀~ vue專案本地執行npm run dev沒問題,但在打包完npm run build伺服器上執行頁面一片空白,指出來最外層的div,一開始以為是路由的寫法有問
關於vue-cli打包後,index顯示空白頁解決方法
1.修改打包時,檔案引用路徑在config檔案加下index.js檔案中,找到 build 中的 assetsPublicPath 將 assetsPublicPath: '/' 修改為 assetsPublicPath: './' 即新增一個點2.註釋相關列印提示(可選
vue使用webPack打包釋出後頁面顯示空白
今天筆者將打包後,進行訪問,訪問到index.html,但是出現的是空白頁。打包命令:npm run build,打包後的檔案如下:這是因為index.html中引入的css ,js 的路徑不對:如下圖這個是因為webpack打包的時候引入js時使用的是絕對路徑導致的,修改w
vue打包靜態資源後顯示空白及static檔案路徑報錯填坑
今天使用vue打包(npm run build)遇到了幾個坑,在這裡分享給大家 打包之後開啟dist的頁面顯示空白: 這個問題以前就處理過,是打包過程中出現錯誤頻率較高的一種,可能有3處地方會出現這種情況 1、記得改一下config下面的index.js中bulid模組
vue打包後頁面顯示空白如何處理
vue打包後頁面顯示空白如何處理 1、當用vue-cli自動構建專案後,有兩種執行方法,分別是: npm run dev :執行專案 npm run build : 打包專案,資源使用相對路徑,所以會出現路徑錯誤問題。 參考:http
vue專案在IE中顯示空白,報錯:vuex requires a Promise polyfill in this browser
問題描述vue專案在非IE核心的瀏覽器中顯示正常,在IE核心瀏覽器中報錯,並顯示空白。報錯如下:SCRIPT5022: [vuex] vuex requires a Promise polyfill in this browser.SCRIPT5009: “Promise”
thinkphp5(tp5)開啟頁面沒有報錯,反而顯示空白頁面
最近在做一個新專案,用的是thinkphp5框架,可能是用thinkphp3.2用的習慣了,在載入頁面的時候,頁面顯示空白,檢視原因的時候發現請求是200,頁面請求是正常的,但是為什麼總顯示的是空白頁面呢,經過仔細查詢,原來在程式碼中少了一個return。 thinkphp5
Oracle EBS登錄頁面顯示空白
color mes media 3.5 ply javax queue 1.3 shu 問題描述 由於ebs數據庫需要閃回,在其他同事閃回數據庫到之前某一天後,重啟ebs應用,發現ebs客戶端登錄顯示空白 以前也出現過類似問題,一般出現此問題,可以嘗試以下操作: 1.重
解決nginx+php二級頁面顯示空白的問題
was 遷移 rec 空白 執行 query 文件處理 spa 無法 遷移官網商城的發現主頁的二級界面顯示空白頁,此https商城網站 後修改nginx配置,顯示正常 添加 location ~ [^/]\.php(/|$) { #fastcgi_pass remot
vue打包後,接口請求404的完美解決方案
修改 後臺 完美解決 保存 跨域 pass rem nginx set 在開發環境中,和後臺對接為了解決跨域問題,使用了代理,也就是vue的proxyTable,但是打包放到生產環境中去時,接口請求不到,404,原因是開發環境的代理並不能用到生產環境,但是直接在請求接口是使
VUE mode為history頁面為空白
當router.js 中mode:history 發現重新整理頁面 不顯示了,原因出來history的請求路徑資源不存在了,這個需要後端配置的, 前端 需要修改一個地方即可, devServer: { port: 8000,
vue 打包後,字尾名為.woff等字型問題不能用解決辦法
1、開啟 build / webpack.prod.conf.js ,找到 module: { rules: utils.styleLoaders({ sourceMap: config.build.productionSourceMap, extract: true,
解決vue打包上線後一片空白問題
打包後用瀏覽器開啟html檔案,很糟糕出現了空白頁 然後我們檢視控制檯報錯資訊,我們知道是html頁並沒有成功引入打包後的專案檔案 然後我們開啟html檔案,並對程式碼進行整理,修改引入檔案的路徑為“./static”,然後再用瀏覽器開啟HTM
nginx+php-fpm配置後頁面顯示空白的解決方法以及用nginx和php-fpm解決“502 Bad Gateway”問題
https://stackoverflow.com/questions/15423500/nginx-showing-blank-php-pages For reference, I am attaching my location block for catching files wi
vue 移動端,頁面左右頁面切換效果(切換過程中會出現白屏效果,布吉島怎麼優化,後來就釋出前就棄用了)
<transition name="left"> <router-view v-if="getCms" class="Router"/> </transition> data() { names: 'left' } watch: { '$route'(to,
vue 移動端,頁面左右頁面切換效果(切換過程中會出現白屏效果,布吉島怎麽優化,後來就發布前就棄用了)
names out name watch bsp etc () nsf his <transition name="left"> <router-view v-if="getCms" class="Router"/> </transition
android5.0載入h5頁面顯示空白
我這個問題出現在android5.0以上---android6.0以下的機子上, 其他版本沒問題。 客服給我反饋說這些問題全部出現在 oppo、vivo上面,都是android5.1.1的版本上。 解決方法: 啟用mixed content 在Android5.0中
vue 元件按需引用,vue-router懶載入,vue打包優化,載入動畫
當打包構建應用時,Javascript 包會變得非常大,影響頁面載入。如果我們能把不同路由對應的元件分割成不同的程式碼塊,然後當路由被訪問的時候才載入對應元件,這樣就更加高效了。結合 Vue 的 非同步元件 和 Webpack 的 code splitting feature
tomcat釋出專案時,頁面顯示undefined
關於這個問題,可能會有兩種結果 1,確實沒資料。解決思路:可以aler()列印結果,檢視是否有資料 2,有資料,用其他應用伺服器可以顯示資料,但是tomcat卻不行。正如我遇到的問題一樣。 用jetty可以檢視到資料,但是,用tomcat的釋出的時候卻不能顯示資料,只要是S
vue專案中,頁面重新整理回到頁面頂部的方法
在Vue專案中,訪問過的頁面,在滾動到某個位置後,再次重新整理頁面,頁面仍處於上次訪問過的位置。為了想頁面回到頂部,只需要對路由進行修改,在router下index.js中:export default new Router({ routes: [{...}], sc