Question

我有一个NextJS应用，正在使用next-routes处理所有路由。

我的路由模块当前如下所示：

const routes = require('next-routes')();
const { getEntries } = require('../data/contentful');

module.exports = async () => {
  const globalSettings = await getEntries({
    content_type: 'globalSettings',
  });

  routes
    .add('caseStudies', `/${globalSettings.fields.caseStudiesSlug}`, 'caseStudies')
    .add('caseStudy', `/${globalSettings.fields.caseStudiesSlug]}/:slug`, 'caseStudy')
    .add('home', `/`, 'index')
    .add('page', `/:slug*`, 'page'));

  return routes;
};

我可以在服务器端使用它，但是要在客户端使用下一个路由，我需要此模块立即返回路由对象，而不是异步函数。例如

const routes = require('next-routes')();
const { getEntries } = require('../data/contentful');

// Do this first, then module.exports
const globalSettings = await getEntries({
  content_type: 'globalSettings',
});

module.exports = routes
  .add('caseStudies', `/${globalSettings.fields.caseStudiesSlug}`, 'caseStudies')
  .add('caseStudy', `/${globalSettings.fields.caseStudiesSlug]}/:slug`, 'caseStudy')
  .add('home', `/`, 'index')
  .add('page', `/:slug*`, 'page'));

这不起作用，因为await必须在异步函数中。在执行路由对象的module.exports之前，如何完成异步API调用？

Answer 1

这是this renowned problem的特例。可以将同步代码转换为异步代码，反之亦然。

如this similar answer中所示，应根据需要在应用程序入口点使用promise：

module.exports = (async () => {
  const globalSettings = await getEntries({
    content_type: 'globalSettings',
  });

  return routes
  .add('caseStudies', `/${globalSettings.fields.caseStudiesSlug}`, 'caseStudies')
  .add('caseStudy', `/${globalSettings.fields.caseStudiesSlug]}/:slug`, 'caseStudy')
  .add('home', `/`, 'index')
  .add('page', `/:slug*`, 'page'));
})();

此模块还导出一个promise，因此需要将其链接到一个依赖于它的模块中。

有a proposal for top-level await旨在为该食谱提供语法糖。

在module.exports之前等待异步功能

1 个答案: