centos雲伺服器nginx部署多vue專案

2021-08-25 22:07:38 字數 1691 閱讀 4184

本文章為博主通過vue模板快速搭建vue專案的筆記,適合初學vue的新人。

專案可部署,看完之後很快就能跟博主一樣快速搭建自己的vue專案。

並且通過可部署的專案,能夠更好更快的理解整個流程,博主主要為後端研發,但仍可快速的理通vue開發的流程。

本專案github原始碼:(兩個均可部署)

仿ins的探索功能

首頁2-後台管理系統:

後台管理系統的儀錶盤

通過mock模擬資料進行表單的展示

框架:vue

請求:axios,介面在src/api包下,axios工具類在src/util中

資料:使用mock進行資料的模擬,在src/mock包下

更新中...

介面資料模擬流程:

vue元件呼叫介面-->

呼叫api目錄下的介面js-->

使用util包下的request(即axios)進行請求傳送-->

介面js被mock目錄下的index.js捕獲-->

根據對映找到mock下的具體js檔案,在其中進行了資料模擬與返回-->

返回資料到vue元件-->

完成資料模擬

1、本地部署

webstorm開啟(我用的webstorm也可以用別的,**上可以買號很便宜)-->

配置好npm環境-->

執行「npm install」安裝依賴-->

執行「npm run dev」執行專案

2、雲伺服器部署

執行「npm run build」打包程式,找到dist資料夾下的內容,上傳到伺服器對應目錄:

下面貼上一下我的nginx配置檔案:

vim /etc/nginx/nginx.conf

root         /home;

location /admin

location /lifecat

error_page 404 /404.html;

location = /40x.html

error_page 500 502 503 504 /50x.html;

location = /50x.html

}

阿里雲伺服器搭建 nginx服務

1.安裝nginx軟體所需依賴包 yum install y gcc gcc c autoconf pcre pcre devel make automake wget httpd tools2.配置nginx官方 yum源 root web vim etc yum.repos.d nginx.re...

阿里雲伺服器安裝 nginx

然後是去安裝依賴的庫 命令列yum y install make gcc gcc c glibc glibc devel lsof pcre pcre devel zlib zlib devel openssl openssl devel這是很全,主要看你有沒有安裝過 yum install pcr...

雲伺服器CentOS安裝Docker

新增阿里源資訊 sudo yum config manager add repo 檢視可用docker版本 yum list docker ce showduplicates sort r 安裝docker yum install docker ce 18.03.1.ce 1.el7.centos ...