前端vue部署


未打包前,前端vue可通過proxy解決跨域問題,當打包上線之后,內置代理將會失效,我們需要使用nginx來解決跨域問題。

首先,通常打包都是使用npm run build命令來進行打包的,但有時間也不一定,可以查看package.json文件scripts下build直接執行即可;

 

 執行完后會生成一個dist文件,里面會將靜態文件打包成static和一個index主頁;

安裝Nginx之后

我們將dist文件放到nginx中的html文件夾下,再進入conf文件夾下的nginx.conf配置文件進行修改

 

 執行nginx命令,start nginx, //關閉nginx nginx -s quit //重啟nginx  nginx -s reload

打開網頁localhost:8888就會顯示主頁面了。

其中心得:我們有時候需要采用逆向思維,例如跨域問題,我們可以從請求網頁中找信息,看請求信息的地址url是否有/prod-api拼接,如果沒有,肯定會出現后台數據訪問不到的現象

跨域的目標地址,因為服務器端也是在本機,所以直接使用127.0.0.1:+端口即可;(不要使用映射地址,不然會出問題,訪問不到)。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM