0

我正在开发一个带有自定义 404 页面的 nuxt 项目。当我安装模块 nuxt-i18n 以使我的网站使用法语和英语时,我遇到了为 404 页面创建的自定义路由的问题。

  • 当我让我的自定义路由进入extendRoutes时,我无法访问像“page/en/”这样的路由,它被重定向到404。
  • 当我禁用此自定义路由时,我没有问题,我的 nuxt-i18n 配置正确。

我该如何管理两者?

这是我的 nuxt.config.js 文件:

export default {
  mode: 'universal',
  router: {
    trailingSlash: true,
    extendRoutes(routes, resolve) {
      routes.push({
        name: 'custom',
        path: '*',
        component: resolve(__dirname, 'pages/404.vue'),
        redirect: '/404/'
      })
    }
  },
  generate: {
      fallback: '404.html'
  },
  modules: [
    'nuxt-i18n',
  ],
  i18n: {
    locales: [{
      code: 'fr',
      iso: 'fr-FR',
      file: 'fr.json',
      dir: 'ltr'
    },
    {
      code: 'en',
      iso: 'en-US',
      file: 'en.json',
      dir: 'ltr'
    }],
    prefix_except_default: 'prefix_except_default',
    defaultLocale: 'fr',
    langDir: 'locales/',
  },
}
4

1 回答 1

1

我有同样的问题,我认为 nuxt-i18n 与自定义 404 页面不兼容。我发现的唯一解决方案是通过以下方式编辑路径path: '/:lang/*'

routes.push({
    name: 'custom',
    path: '/:lang/*',
    component: resolve(__dirname, 'pages/404.vue')
})

它有效,但创建一个奇怪的重定向/en/toto/en/en/toto

于 2021-05-03T12:49:04.927 回答