vue項目打包部署_nginx代理訪問方法詳解
更新時間：2018年09月20日 10:24:08 作者：kaola_l
今天小編就為大家分享一篇vue項目打包部署_nginx代理訪問方法詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
我又來了，今天部署了下vue項目，使用nginx做了代理，這樣可以解決跨域的問題，這里做一個簡單講解。
1、先看vue項目打包（我這里使用的是vscode開發(fā)工具）
這里是我的項目結(jié)構(gòu)：
打包之前需要修改如下配置文件：
配置文件一：build>>utils.js (修改publicPath:"../../" , 這樣寫是處理打包后找不到靜態(tài)文件的問題)
配置文件二：config>>index.js(修改assetsPublicPath:'./' ,修改目的是為了解決js找不到的問題)
上面兩步修改完成之后就可以進(jìn)行打包了
在控制臺終端輸入npm run build
坐等打包
打包完成之后項目中會生成一個dist文件夾，直接訪問里面的index.html就ok了
我這里有點特殊的地方，需要修改下index.html文件，是因為自己加的一個moment.js
ok，到這里打包的事情完成了，下面就放到服務(wù)器上去了
我這里使用的windows版本的nginx做演示，linux的不做講解了，還有nginx的下載安裝也不做講解，直接看配置：
配置完成后，去啟動你的nginx，然后訪問就ok了！
以上這篇vue項目打包部署_nginx代理訪問方法詳解就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要給大家介紹了關(guān)于vue解決跨域問題的幾種方式,跨域跨域報錯是前端開發(fā)中非常經(jīng)典的一個錯誤,文中通過代碼示例介紹的非常詳細(xì),需要的朋友可以參考下2023-07-07
這篇文章主要為大家詳細(xì)介紹了vue實現(xiàn)翻牌動畫，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
本文分步驟給大家介紹了vue中引入mxGraph的方法，非常不錯，給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值,需要的朋友可以參考下2019-05-05
這篇文章主要為大家介紹了Vue首屏?xí)r間指標(biāo)采集最佳方式示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-01-01
nvm全英文也叫node.js version management，是一個nodejs的版本管理工具，這篇文章主要介紹了Vue中nvm-windows的安裝與使用,需要的朋友可以參考下2023-02-02
利用Vue模擬實現(xiàn)element-ui的分頁器效果
這篇文章主要為大家詳細(xì)介紹了如何利用Vue模擬實現(xiàn)element-ui的分頁器效果，文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以動手嘗試一下2022-11-11
這篇文章主要介紹了vue常用組件之confirm用法及說明，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
ExcelJS是一個用于在Node.js和瀏覽器中創(chuàng)建、讀取和修改Excel文件的強(qiáng)大JavaScript庫,下面這篇文章主要給大家介紹了關(guān)于vue2項目使用exceljs多表頭導(dǎo)出功能的相關(guān)資料,需要的朋友可以參考下2024-05-05
這篇文章主要為大家詳細(xì)介紹了Vue如何利用高德地圖API實現(xiàn)實時天氣,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-12-12
vue 實現(xiàn)復(fù)制內(nèi)容到粘貼板clipboard的方法
下面小編就為大家分享一篇vue 實現(xiàn)復(fù)制內(nèi)容到粘貼板clipboard的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03