如何禁用 nuxt 默认错误重定向

Posted 2023-03-06

【中文标题】如何禁用 nuxt 默认错误重定向

【英文标题】：How do I disable nuxt default error redirection

【发布时间】：2020-04-05 03:15:30

【问题描述】：

使用 Vuetify 设置一个 nuxt 项目。其中一个页面使用client-only (no-s-s-r) 组件。在开发过程中，如果此组件出现错误，我会被重定向到默认错误页面，这会阻止我使用 Vue devtools 检查变量和组件。

我觉得它应该非常简单，但我找不到禁用这种自动重定向行为的方法。所以我想我的问题是？

【问题讨论】：

damirscorner.com/blog/posts/20200904-ErrorHandlingInNuxtjs.html

我不知道如何禁用重定向错误布局，虽然我猜很多人不想在生产环境中禁用它，他们只需要这个用于开发目的，我建议在 if 条件下添加此 process.env.NODE_ENV !== 'production' 以便仅在开发环境中禁用重定向

【参考方案1】：

我发现了一个带有 nuxt 插件的 hack：

./plugins/errors.js

export default function( app ) 
  app.nuxt.error = () => 

./nuxt.config.js

module.exports = 
  ...
  plugins: [
    "~/plugins/errors.js",
  ],

【讨论】：

请注意，这仍然使用错误布局，我找不到禁用它的方法

【参考方案2】：

您不能从 nuxt 配置中禁用 <nuxt-error> 渲染。

另一种方法是按如下方式破解 nuxt 渲染：

1/ 打开文件./node_modules/@nuxt/vue-app/template/components/nuxt.js 2/ 转到render(h) 方法 3/ 删除错误条件以始终显示组件：

  render (h) 

    // HACK TO SKIP ERROR
    this.nuxt.err = false

    // if there is no error
    if (!this.nuxt.err) 
      // Directly return nuxt child
      return h('NuxtChild', 
        key: this.routerViewKey,
        props: this.$props
      )
    

    // ...
  

nb: 在每个 npm 或 yarn 安装后，上述文件中的 hack 将被覆盖。

【讨论】：

不敢相信这不是可定制的......