Nuxt.js 静态站点和 404 页面

Nuxt.js static site and 404 page

我目前创建了一个 pages/404.vue 文件,然后,在我的服务器设置中,我将任何不存在的 url 重定向到 /404.html(生成的页面)。

除了我必须声明文件扩展名(如果我重定向到 /404 它会给我重定向错误),它似乎工作正常,我想它也会给我一个创建其他服务器错误文件的简单方法, 如果需要的话。

但是,根据文档,我首先尝试在 generate:{ } 中添加 fallback: true。这会在我的根目录中创建一个 404.html 页面,但使用默认的 Nuxt 布局(无限加载轮页面)。

我原以为创建 layouts/error.vue(根据文档)可以解决问题,但事实并非如此。

什么是正确的做法,如果要遵循文档,为什么我的个性化 error.vue 不起作用? 谢谢。

没有收到答复。

我最后删除了 pages/404.vue 并将其创建为 layouts/error.vue

error.vue 给了我与 default.vue 相关的错误,出于某些原因,所以我创建了一个 layouts/basic.vue 布局作为 error.vue 的(几乎)空容器。

错误页面现在可以在开发期间和新的 nuxt 开始在完整静态站点上进行本地测试(自 nuxt 2.13 起),但仍然不能在实时站点上运行,我将检查它是否与服务器设置有关。

以上内容与 nuxt.config.js 中的 generate: { fallback: true }(创建 404.html 页面)

为了在 nuxt.js 中生成 404 回退页面,您需要首先像这样在 nuxt.config.js 中设置生成选项 generate: { fallback: '404.html' }

然后您需要在布局目录中创建一个名为 error.vue 的新布局

layouts/error.vue

完成此操作后,您可以 nuxt generate 然后 nuxt start 到 运行 带有 404 错误后备页面的项目。