提示：文章寫完后，目錄可以自動生成，如何生成可參考右邊的幫助文檔

前言

提示：這里可以添加本文要記錄的大概內(nèi)容：
本文內(nèi)容記錄如何在Linux(Ubuntu)系統(tǒng)上安裝Nginx，并部署打包好的Vue前端項目，最后通過瀏覽器訪問。

提示：以下是本篇文章正文內(nèi)容，下面案例可供參考

一、打包Vue項目

首先有一個基于Vue開發(fā)的前端項目，然后用編輯器打開項目，本文采用Vscode作為前端項目編輯器，打開前端項目后，開一個終端。

點開Terminal后出現(xiàn)這個界面，后輸入一下命令npm run build進行項目打包。

運行成功之后會在項目目錄上出現(xiàn)一個dist文件夾，該文件夾就是打包好的項目，把他壓縮后上傳到服務器，并解壓。

二、安裝Nginx

連接到Linux服務器，我這是在虛擬機上安裝的Linux（Ubuntu）操作系統(tǒng)，有可視化界面，然后右鍵打開一個終端，如果是云服務器，或者其他，應該連接后就是一個終端窗口。然后在終端窗口通過命令安裝Nginx。

1.更新系統(tǒng)的軟件包信息：

sudo apt update

2.安裝Nginx：

sudo apt install nginx

3.啟動 Nginx 服務：安裝完成后，Nginx 服務會自動啟動。如果沒有自動啟動，你可以使用以下命令手動啟動 Nginx 服務：

sudo systemctl start nginx

4.驗證安裝：使用以下命令檢查 Nginx 服務是否正在運行：

sudo systemctl status nginx

運行結果如果出現(xiàn)上圖所示表示，Nginx運行成功。

5.測試是否能夠正常訪問：

首先查看本機電腦是否能夠正常連接你安裝了Nginx的那臺服務器。可以通過ping +服務器地址進行查看。首先通過Win+R并在輸入框輸入cmd打開本機終端。

如果數(shù)據(jù)包沒有丟失，說明是通的。然后在瀏覽器中輸入 你ping的服務器地址加80端口，例如192.132.128.138:80,如果出現(xiàn)一下界面說明可以正常訪問Nginx。

三、配置nginx.conf并部署項目

接下來要把之前上傳到服務器的前端項目和Nginx進行綁定。這就需要通過配置nginx.conf文件進行綁定，當然這里還可以配置一下其他的內(nèi)容，例如反向代理，安全之類。

1.首先需要找到nginx.conf在哪：

一般下載后的Nginx會在 /etc/nginx文件夾下。如何找不到可以通過命令進行搜索。

sudo find / -name nginx.conf

找到nginx.conf后進入其所在的文件夾。然后通過下面命令進行編輯，

sudo vim nginx.conf

2.對nginx.conf文件進行配置：

打開nginx.conf后找以下位置進行配置。該文件中有個http{}模塊如下所示，并在該模塊內(nèi)部的任意空白位置添加以下內(nèi)容：

http{ 
 ##
        # Basic Settings
        ##
        sendfile on;
        #
         server {
                listen 80; #默認端口號，如過有被其他進程占用可以換一個。
                server_name 192.132.128.138;  #換成你的服務器地址
              
                location / {
                       root  /home/user/dist; #上傳到服務器的前端項目所在根目錄（就是打包生成的dist文件夾）。
                       index index.html index.htm ;

                      }

               }

}

ps(按 i 進行文本編輯，編輯好后按Esc切換模式，之后并按:wq進行保存并退出。)

3.查看編輯后的nginx.conf文件是否有語法錯誤：

sudo nginx -t

如何顯示ok 和successful說明沒有語法錯誤。

4.重新加載Nginx并重啟：

sudo systemctl reload nginx
sudo systemctl restart nginx

5.通過瀏覽器訪問：

瀏覽器中輸入192.132.128.138:80就可出現(xiàn)項目的首頁。

四、后端springBoot項目部署

這個部署起來是很容易的直接把項目打成jar包，上傳到服務器，然后通過一個命令就能啟動。

直接在idea中的maven中找到Lifecyle,然后雙擊package。就會在target目錄中生成項目jar包。
或者通過命令窗口用mvn package 命令進行打包，前提要安裝maven,不然會顯示無法識別mvn，并且運行該命令時的位置在springboot項目的根目錄下。
將打包好的jar包上傳到服務器的某個位置最好新建一個文件夾（例如target）。通過以下命令啟動后端項目。

java -jar target/your-project-name.jar --spring.profiles.active=dev

ps: --spring.profiles.active=dev 為指定采用哪個applicatiion.yml文件。

總結

這樣前后端項目就都部署運行了。不給過最初還得安裝好數(shù)據(jù)庫等一些項目中應用到的軟件,才能使得項目正常運行。文章來源地址http://www.zghlxwxcb.cn/news/detail-853649.html

到了這里，關于如何在linux服務器上用Nginx部署Vue項目，以及如何部署springboot后端項目的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！