vue項目打包上傳到服務器具體操作

這幾天爲了測試一個項目,自己嘗試將前端項目打包放置到自己的服務器上,我用的是阿里雲,下面也是以阿里云爲例

使用的工具是xshell6+FileZilla

xshell6想免費試用就去下載家庭免費版  >官網下載

 

1.服務器

上傳服務器,你首先得有個服務器吧,買一個也不貴,或者用公司的

2.安裝好軟件 xshell6  FileZilla

打開xshell 左上角新建,先輸入主機IP (服務器ip)

用戶身份驗證登錄,賬號一般爲root,只要你沒修改過,密碼如果忘記了,就自己去修改一下

重置密碼的步驟      進入雲服務器=>實例

執行下面命令
sudo apt-get install openssh-server
sudo apt-get install nginx

如果nginx 安裝不上(一般阿里裝不上)
執行下面四個命令(有判斷選Y)
(下面代碼四行最好自己手打,我複製粘貼出錯了...)
apt-get update
apt-get upgrade
apt-get install nginx
service nginx start

3.nginx安裝成功後,登錄阿里雲,進入控制檯,修改安全組規則

3.1進入安全組

  

3.2添加安全組,端口自己設置

3.3 在Xshell中輸入指令,進入文件,編輯配置文件

cd /etc/nginx/sites-enabled/

vim default

3.4修改保存

(vim default進入之後)

3.5 重啓nginx,9000就可以訪問了 

輸入service nginx restart

4.在Filezilla中

4.1連接服務器

4.2進入 /etc/nginx/conf.d 目錄

右鍵 創建新文件以.conf爲後綴 例如:lf.conf

4.3文件夾中添加這段話

server{
        listen 9000;    #端口號
        server_name www.moblie.site;
        location / {
            index index.html;    #默認頁面
            root /var/www/dist;   #根目錄,
        }

}

 

4.4重啓nginx服務service nginx restart,再次訪問ip

5.打包項目

 打包前將需要配置的配置好,

npm run build

6.  Filezilla 中遠程站點 搜索 /var/www 自己文件夾中dist文件直接拖進去

7.網頁中訪問自己服務器的ip   

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章