Next.js 静态路由与动态路由存在重叠。

Question

我正在使用Next.JS应用程序路由系统。

我创建了一个结构为pages/[country]/[language]/index.js的动态路由。

还有一个结构为pages/cz/cz/index.js的静态路由。

问题出现在我在静态页面上并尝试通过组件导航来访问静态路由内容时，我的情况下应该转到主页并重新加载同一页面，但实际上呈现了动态路由内容。

在我的情况下，对于两个路由，链接只是简单地导航到主页。但也许问题在于如何为预定义和动态路由设置index.js文件。

cz/cz/index.js

export { default } from '../../../components/HomePage/';

const { getStaticProps } = createRoute({
  path: '/',
  locale: 'cs',
});

export { getStaticProps };

[country]/[language]/index.js

export { default } from '../../../components/HomePage/v2';

const { getStaticPaths, getStaticProps } = createRoute({
  path: '/',
  exclude: ['cs'],
  otherLocales: ['cs'],
});

export { getStaticPaths, getStaticProps };

创建路由

export default function createRoute({
  path,
  otherLocales,
  getPathParams,
  locale,
} = {}) {
  const locales = _.without(include, ...exclude);
  return {
    getStaticPaths: createGetStaticPaths({
      locales,
      getPathParams,
    }),
    getStaticProps: createGetStaticProps({
      path,
      locale,
      locales,
      otherLocales,
    }),
  };
}

页面结构

那么为什么[country]/[language]/index.js会覆盖cz/cz/index.js?

是否有任何在NextJS路由中匹配URL的绝对方法可用？

或确保从静态路由转到静态路由？

- User Paulius

---

你能分享文件夹结构和代码，并带有链接重定向吗？ - Fiodorov Andrei

@FiodorovAndrei 添加了文件夹结构并更新了描述。 - User Paulius

你可以添加使用 Link 组件的代码吗？ - juliomalves

你正在使用什么 Link？你应该使用 Next.js 内置的 Link 进行导航。另外，你的主页是什么样子的？请提供一个 [mre]。 - juliomalves

无法在CodeSandbox上重现问题，但在描述中提供了更多的代码信息，也许会有所帮助。 - User Paulius

Answer 1

根据next.js 文档，预定义路由优先于动态路由，动态路由优先于通配路由。以下是几个示例：

• pages/post/create.js - 匹配 /post/create
• pages/post/[pid].js - 匹配 /post/1、/post/abc 等，但不匹配 /post/create
• pages/post/[...slug].js - 匹配 /post/1/2、/post/a/b/c 等，但不匹配 /post/create、/post/abc

在您的情况下，您定义了预定义路由 cz/cz/index.js ，该路由具有优先权。

- Fiodorov Andrei

---

这就是问题所在，因为我的预定义路由cz/cz/index.js没有优先权，而动态路由覆盖了它，反之亦然。 - User Paulius

你能提供一个带有项目结构的 CodeSandbox 示例吗？因为很难理解为什么动态路由会覆盖你预定义的路由。 - Fiodorov Andrei

无法在CodeSandbox上重现问题，但在描述中提供了更多的代码信息，也许会有所帮助。 - User Paulius

Answer 2

如果您正在使用重定向，请注意它们在 next 转到页面之前进行处理。

重定向是在文件系统（包括页面和 /public 文件）之前检查的。

https://nextjs.org/docs/api-reference/next.config.js/redirects

- Karuhanga