当我刷新 react.js 和 next.js 页面时，它给了我 404 错误

Question

我有一个 React.js 和 Next.js 网站，它运行良好，直到我导出生产版本。 当我在服务器上发布我的项目时，我遇到了这个问题：当我刷新页面时，它给了我 404 错误。

刷新页面并设置其配置后，我发现 Next.js 404 错误。 但我的问题仍然存在。

我所有的链接都是这样的：

import Link from 'next/link';
export default () => (
 <Link href="/profile">
   <a>profile</a>
 </Link>
)

Answer 1

对于静态 HTML 导出，您必须使用exportPathMap参考： https ://nextjs.org/docs/api-reference/next.config.js/exportPathMap

module.exports = {
  exportPathMap: async function (
    defaultPathMap,
    { dev, dir, outDir, distDir, buildId }
  ) {
    return {
      '/': { page: '/' },
      '/profile': { page: '/profile' },
      '/p/hello-nextjs': { page: '/post', query: { title: 'hello-nextjs' } },
      '/p/learn-nextjs': { page: '/post', query: { title: 'learn-nextjs' } },
      '/p/deploy-nextjs': { page: '/post', query: { title: 'deploy-nextjs' } },
    }
  },
}

Answer 2

将此添加到next.config.js

module.exports = {
  trailingSlash: true,
}