將 Nuxt.js 應用和 Apache 伺服器結合,可以讓你的網站或 Web 應用達到更高的效能和安全性。本教學將引導你完成這個過程。

前提條件

  • 已經安裝 Apache 伺服器
  • 已經安裝 Node.js 和 Nuxt.js
  • 基本的 Apache 和 Linux 知識

步驟一:建立 Nuxt.js 應用

如果你還沒有 Nuxt.js 應用,可以使用以下命令來建立一個:

npx create-nuxt-app my-nuxt-app

步驟二:編譯 Nuxt.js 應用

在你的 Nuxt.js 應用目錄裡,執行:

yarn build

步驟三:使用 PM2 管理 Nuxt.js 應用

安裝 PM2 並用它來管理你的應用:

npm install -g pm2
pm2 start yarn --name "my-nuxt-app" -- start

步驟四:建立 Apache 設定檔

  1. /etc/apache2/sites-available/ 目錄下建立一個新的 .conf 檔案:

    sudo nano /etc/apache2/sites-available/my-nuxt-app.conf
  2. 將以下內容貼入 .conf 檔案:

    
        ServerName yourdomain.com
        ServerAlias www.yourdomain.com
    
        ProxyPass / http://localhost:3000/
        ProxyPassReverse / http://localhost:3000/
    

步驟五:啟用新的 Apache 設定

  1. 啟用新的設定檔:

    sudo a2ensite my-nuxt-app.conf
  2. 啟用代理模組:

    sudo a2enmod proxy
    sudo a2enmod proxy_http
  3. 重新啟動 Apache:

    sudo systemctl reload apache2

步驟六:設定 PM2 開機自啟

使你的 Nuxt.js 應用在系統啟動時自動運行:

pm2 startup
pm2 save

完成以上步驟後,你的 Nuxt.js 應用不僅會運行在 Apache 伺服器上,還會在系統啟動時自動運行,提供高可用性和可擴展性。

這樣,你就成功地完成了 Apache 和 Nuxt.js 的完美結合。希望這篇教學能幫助你順利地完成部署!

最後修改日期: 2023 年 9 月 13 日

作者