Next.js 国际化路由：生产构建错误：预渲染页面发生错误

Question

我有以下 next.config.js：

module.exports = withBundleAnalyzer({
  i18n: {
    locales: ['en', 'es'],
    defaultLocale: 'en',
    localeDetection: false,
  },
  ...
});

这使区域设置en和es的路由成为默认区域设置。

在项目的根目录中存在_posts/en和_post/es保存动态帖子页面的.md文件。

当我运行开发脚本"dev": "next dev"能够毫无问题地在两个语言环境之间切换并浏览页面。

但是，如果我运行 prod 脚本"build-prod": "run-s clean build export"是在以下内容中调用的脚本： "clean": "rimraf.next out" , "build": "build": "next build" ， "export": "next export"

然后我收到以下错误：

Error occurred prerendering page "/en/posts/[slug]"
TypeError: Cannot read properties of undefined (reading 'undefined')

Error occurred prerendering page "/en/posts/[slug]"
TypeError: Cannot read properties of undefined (reading 'undefined')

> Build error occurred
Error: Export encountered errors on following paths:
    /posts/[slug]: /en/posts/[slug]
    /posts/[slug]: /es/posts/[slug]

有谁知道 dev 和 prod 之间可能导致此问题的不同之处？

谢谢

Answer 1

显然 i18n 支持与 static HTML 导出不兼容所以我决定放弃它。

相反，我决定实施我自己的国际化路由解决方案。

我使用next-language-detector来处理语言检测，并从我的 Next.js 项目的索引页面重定向到首选语言的内容。

为了管理内容，我为每种语言启用了一条路径，在pages/下添加带有语言代码的目录。 在我的例子中es和en 。 每个目录都会读取存储在markdown中的翻译后的数据。

对于类似的方法，请参阅本文： https://dev.to/adrai/static-html-export-with-i18n-compatibility-in-nextjs-8cd