vue項目運行時出現(xiàn)It works的問題解決
問題描述
運行一個vue項目時,一切正常,沒有報錯,但是點開網(wǎng)頁鏈接后,顯示空白頁面,空白頁面上有個It works!如圖所示

問題分析
It works!頁面出現(xiàn)說明vue項目配置正常,但是無法顯示頁面,說明端口傳輸異常,很可能默認(rèn)端口被別的進(jìn)程占用,需要更換成閑置端口
問題解決
首先查看項目使用的端口

通過運行地址能夠得知項目使用80端口,接下來需要更改這一端口然后,需要找到設(shè)置端口的文件位置,我的項目中,設(shè)置端口的位置在vite.config.js文件中,其中設(shè)置了server的port,如圖所示

也可以直接在項目中搜索對應(yīng)的端口,找到設(shè)置端口的位置,如圖所示

將port后的數(shù)字改成一個閑置端口,如圖所示

我將原端口改為了1113,然后保存文件更改,再重新運行項目,可以看到項目運行的地址已經(jīng)改變,如圖所示

此時不再出現(xiàn)it works,而是成功加載頁面
到此這篇關(guān)于vue項目運行時出現(xiàn)It works的問題解決的文章就介紹到這了,更多相關(guān)vue It works內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
誤引用vuex-persistedstate導(dǎo)致用戶信息無法清除問題及解決
這篇文章主要介紹了誤引用vuex-persistedstate導(dǎo)致用戶信息無法清除問題及解決方案,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-04-04
Vue+Echart柱狀圖實現(xiàn)疫情數(shù)據(jù)統(tǒng)計
這篇文章主要介紹了在Vue nuxt項目中,如何使用Echart(百度圖表)柱狀圖來實現(xiàn)疫情數(shù)據(jù)統(tǒng)計,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2021-12-12
利用vue + koa2 + mockjs模擬數(shù)據(jù)的方法教程
這篇文章主要給大家介紹了關(guān)于利用vue + koa2 + mockjs模擬數(shù)據(jù)的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-11-11
Vue(element ui)中操作row參數(shù)的使用方式
這篇文章主要介紹了Vue(element ui)中操作row參數(shù)的使用方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2025-04-04

