當前位置 主頁 > 服務器問題 > win服務器問題匯總 > 最大化 縮小

    Vue.js項目部署到服務器的詳細步驟

    欄目:win服務器問題匯總 時間:2019-10-18 08:12

    前言

      最近做完了一個項目,Vue.js 2.0 + vuex + axios,還是有點大的。想著做了這么久,放服務器給朋友們體驗一下,幫忙找找BUG,于是就有了研究服務器這一篇文章了。

    準備工作

    服務器

    既然是部署到服務器,肯定是需要一個云的。我這里找基友拿的一個,做測試的話,可以買阿里云的學生機,9.9 一個月,不過不是學生的話就比較麻煩,因為涉及敏感操作都需要驗證碼。

    編譯打包

    將項目打包成 dist 文件,這里我需要跨域請求一些數據,還寫了一個小型服務器, app.js 放到 dist 文件夾 同級目錄。

    Xshell

    因為基友的是 centos 的服務器,所以用 xshell 的話稍微好操作一點,我是 win10。

    WinSCP

    接觸命令行并不多,所以面對命令行編程我還是有點效率不高。這個軟件就方便了文件的上傳,編輯等等,圖形化界面。

    正式開始

    有了上面幾項之后,可以正式開始部署工作了。

    登錄 WinSCP,連接遠程服務器

    打開 WinSCP,會出現如下界面

    WinSCP登錄界面

    主機名,輸入你的服務器公網 ip,端口號不變,用戶名一般是 root,密碼則是你購買服務器時設置的密碼,點擊登錄。

    登錄成功界面

    默認是 /root 界面。

    這時候把你打包好的文件,扔到某一個目錄下,如 /opt,dist 和 app.js 在同一目錄

    登錄 Xshell 連接遠程服務器

    打開 Xshell,第一次登錄會有如下界面:

    Xshell登錄

    名稱可以隨便取一個,協議選擇 SSH,主機就是你的公網 ip,

    之后會有這個頁面

    會話

    這里我是創建好了的,點擊就可以直接連接。如果你是從上一步過來的,點擊之后會要輸入密碼

    輸入密碼

    之后就連接到遠程 Linux 系統了。

    連接成功

    安裝 node.js

    由于我的項目是需要跨域請求數據,所以這里我選擇的是用 Node.js 啟動小型服務器,請求數據。

    下載源碼 解壓源碼 編譯安裝

    下載源碼,這里以最新的 6.11.1 為例:

    cd /usr/local/src/
    wget http://nodejs.org/dist/v6.11.1/node-v6.11.1.tar.gz

    解壓源碼:

    cd /usr/local/src/
    tar zxvf node-v6.11.1.tar.gz

    編譯安裝:

    cd node-v6.11.1
    ./configure --prefix=/usr/local/node/6.11.1
    make
    make install

    這里 make 過程大約30分鐘,可以去做別的。

    ps:這里我遇到服務器沒有安裝 g++ 的問題,那直接

    yum install gcc-c++

    就可以了。

    安裝完成后,還需要對 node 進行環境變量的配置

    這里通過 WinSCP 找到 /etc/profile,右鍵該文件,編輯。

    在 export PATH USER LOGNAME MAIL HOSTNAME HISTSIZE HISTCONTROL 上面一行添加如下代碼:

    #set for nodejs
    export NODE_HOME=/usr/local/node/6.11.1
    export PATH=$NODE_HOME/bin:$PATH
    
777亚洲人成视频免费视频