Vue項目打包部署到服務器

一、安裝Node.js和Vue-cli

Node.js是一個開源的、跨平台的JavaScript運行環境，用於編寫服務器端應用程序。Vue-cli是Vue.js官方提供的一個腳手架工具，可以更方便地進行Vue項目的搭建、編譯和調試。

1、安裝Node.js：

sudo apt-get update
sudo apt-get install nodejs
sudo apt-get install npm

2、安裝Vue-cli：

npm install -g vue-cli

二、創建Vue項目

1、使用Vue-cli創建一個基本的Vue項目：

vue init webpack my-project

其中，my-project是你的項目名稱。

2、進入項目目錄，在終端中輸入以下命令啟動項目：

cd my-project
npm install
npm run dev

這時候你會看到一個歡迎頁面，表示項目創建和啟動成功。

三、打包Vue項目

1、在項目目錄下輸入以下命令進行打包：

npm run build

打包成功後，可以在項目的 /dist 目錄下找到打包後的文件。

四、部署Vue項目到服務器

1、在服務器上安裝Nginx：

sudo apt-get update
sudo apt-get install nginx

2、配置Nginx：

在 /etc/nginx/sites-available 目錄下創建一個新的配置文件，例如 my-project.conf，內容如下：

server {
    listen 80;
    server_name your-domain.com; # 替換為你的域名

    location / {
        root /path/to/my-project/dist; # 替換為你的項目路徑
        index index.html;
        try_files $uri $uri/ /index.html;
    }
}

3、啟動Nginx：

sudo service nginx start

現在你就可以通過你的域名訪問你的Vue項目了。

五、使用PM2進行進程管理

如果你的Vue項目需要長時間運行或者需要在服務器上運行多個項目，建議使用PM2進行進程管理。

1、全局安裝PM2：

sudo npm install -g pm2

2、啟動項目：

pm2 start /path/to/my-project/dist/index.js --name my-project

其中，my-project是你的項目名稱。

3、其他常用命令：

pm2 list # 列出所有運行的進程
pm2 stop all # 停止所有進程
pm2 restart my-project # 重啟 my-project 進程
pm2 delete my-project # 刪除 my-project 進程

六、結語

以上就是使用Vue-cli創建、打包、部署Vue項目的完整流程。當然，在實際操作中還有許多細節需要注意，比如安全性、性能優化等等，這些內容可以根據具體情況進行深入研究。