Nuxt 3 部署到托管

Question

我在 https://nuxt-deploy.mpetrosyan.com 托管了我的 Nuxt 3 项目。从主页导航到帖子页面时，一切正常。但是，如果我在发帖时刷新页面（例如，https://nuxt-deploy.mpetrosyan.com/posts），我会收到 404 错误。

我使用 npm rungenerate 来构建项目。

我的应用程序目录如下所示：

nuxt-deploy/
  ├── .htaccess
  ├── dist/

这是我的 .htaccess 文件：

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteCond %{REQUEST_URI} !dist/
  RewriteRule (.*) /dist/$1 [L]
  RewriteRule ^dist\index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /dist/index.html [L]
</IfModule>

我无法直接访问 Apache 配置。如果我将所有文件从 dist 文件夹移动到根文件夹，一切正常，但我想避免这种情况。如何配置我的设置以正确处理页面刷新而不移动文件？

Answer 1

我认为问题出在你的 htaccess 配置上。

服务器未正确重写 Nuxt.js 应用程序的 URL。

您可以修改

.htaccess

文件以确保所有请求都通过

index.html

目录中的

dist

进行路由。

尝试用以下规则替换现有规则：

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /dist/index.html [L]