有什么方法可以访问 Next.js 中的 `__filename` 吗？

Question

我正在开发一个自定义 i18n 模块，并且希望替换此代码（这是一个“关于我们”页面）：

  const messages = (await import(`./about-us.${locale}.json`))
    .default as Messages;

经过

  const messages = (
    await import(`./${__filename.replace('.tsx', `.${locale}.json`)}`)
  ).default as Messages;

不幸的__filename是/index.js（我猜是因为 Webpack？） - 有什么方法可以实现我在示例中尝试做的事情，或者需要直接内置 Next.js 才能工作？

Answer 1

经过长时间的搜索，解决方案是编写一个useMessages钩子，使用自定义 Babel 插件“注入”正确的字符串。

加载程序Webpack似乎不是正确的选择，因为加载程序只能访问它加载的文件的内容。通过使用 Babel，我们有更多选项将代码注入到最终编译版本中。