如何将 nuxt.js 应用程序部署到 Apache？答案

【问题标题】：How can I deploy a nuxt.js app to Apache?如何将 nuxt.js 应用程序部署到 Apache？
【发布时间】：2022-01-17 02:59:23
【问题描述】：

我用 nuxt.js 开始了我自己的博客（静态内容）。但是当我将 nuxt.js 应用程序部署到 Apache 时遇到了一些问题。

我知道将 nuxt.js 部署到 Nginx 会更好，但是除了 Apache 之外我别无选择 .. ????我为我的 nuxt.js 应用程序进行了代理设置以连接我的域。但是只有主页有效，其他页面显示无效的 DNS 错误消息。

我做了什么

npm nuxt generate > npm nuxt start 在我的 CLI 中
httpd-vhost.conf 中的代理设置

<VirtualHost *:80>
    ServerName mydomain.com
    DocumentRoot "/Users/myname/projects"
    ProxyRequests OFF
    ProxyPreserveHost On
    ProxyPass / http://localhost:3000
    ProxyPassReverse / http://localhost:3000
</VirtualHost>

当我浏览我的域时，登录页面会显示，但其他页面没有。

Clink Publications 页面 -> 显示“localhost:3000publications”的无效 DNS 错误
无法加载图像（jpg、png）文件。

如何将我的 nuxt.js 部署到 Apache？

感谢您的帮助！

【问题讨论】：

标签： apache deployment nuxt.js

【解决方案1】：

您的 mod_proxy 配置的问题是您缺少代理 URL 的尾部斜杠，即两个指令必须是：
```
   ProxyPass / http://localhost:3000/
   ProxyPassReverse / http://localhost:3000/
```
但是，如果您使用nuxt generate 生成了一个静态 Nuxt 站点，并且需要使用 Apache 为其提供服务，那么您不需要使用 nuxt start 运行 Nuxt 应用程序。相反，您可以直接使用 Apache 提供生成的静态文件。

将 Nuxt 应用程序的 dist 子目录的内容上传到 Apache DocumentRoot，删除代理配置指令，这应该就是所需要的。

【讨论】：

@RWS 感谢您的大力帮助！尾部的斜杠是导致无效 DNS 错误的原因 :) 现在我知道如何部署静态文件了！

【解决方案2】：

您是将站点部署到子文件夹还是服务器的根目录？

【讨论】：

感谢您的回答！ ??‍♀️ 我正在将站点部署到服务器的根目录，但现在我知道如何将静态文件部署到 apache :)