本篇記錄一下如何在Linux服務器部署vue項目
剛開始的時候我犯了一個慣性錯誤，以為部署vue項目和前面部署django服務一樣，需要把vue工程文件拷貝到服務器，然后使用命令啟動，如npm run serve
又是安裝node環境，又是npm install安裝依賴包等，一通操作下來，也沒搞定。。。
后來偶然看到一篇文章，解釋了vue項目到底該怎么部署(其實問問身邊的前端開發就知道怎么回事了)
平時在本地開發時，使用npm run啟動項目，這相當於本地開發調試，
而當調試完成，覺得可以部署到生產環境時，需要把項目打包，打包后會生成一堆靜態文件，此時只需借助web服務器訪問這些靜態文件，前端服務就相當於部署好了
並不需要在服務器在搭一套開發環境，然后運行項目代碼！！！
1、打包項目文件
在項目目錄下執行命令 npm run build 即可，會在項目目錄下生成一個dist文件夾，
注意1：打包前，還需要進行如下配置：找到項目的config文件夾下面的index.js，定位到build，將里面的assetsPublicPath改成'./
如果你的vue版本比較新，可能沒有上述文件，此應該修改另一個文件
在項目根目錄下找到vue.config.js，如果沒有，則新建一個文件，添加如下內容
module.exports = {
publicPath: './'
}注意2: 打包前，修改前端調用的后端地址為后端服務所在的地址
最后執行命令 npm run build
可以看到，生成如下dist文件夾
在本地打開index.html，打開后其實就能正常查看前端頁面了
打包完成后，把dist整個文件夾傳到服務器,我放到了如下地址
/data/apps/datafactoryfront
千萬不能放到root目錄下！！！
2、安裝配置nginx
關於nginx的安裝以及常用命令可以參考如下文章
https://www.cnblogs.com/hanmk/p/9258149.html
https://www.cnblogs.com/pxstar/p/14808244.html
3、配置nginx代理前端靜態資源
打開nginx配置文件
配置文件所在路徑
/usr/local/nginx/conf/nginx.conf
listen：監聽80端口，這里不用改動；
server_name：默認是localhost，指定(虛擬主機)服務器名稱，一般會配置域名(example.org ，www.example.org，可以使用精確的名稱、通配符名稱或正則表達式定義；當你在外網訪問一個請求鏈接時，nginx會根據你填寫的主機名稱來匹配是轉發到server1還是server2)；
location：/ 表示匹配路徑，這里表示匹配根路徑，里面的root表示匹配到服務器下的dist靜態資源文件夾；
關於nginx如何轉發請求，之前寫過一個例子，里面詳細進行了介紹
https://www.cnblogs.com/hanmk/p/9290533.html
配置完成后，訪問服務器地址，如：http://192.xxx.xxx.xxx 即可正常打開前端服務