时间戳

首页 > 解决方案 > 如何更改 NextJS 根路径页面

reactjs - 如何更改 NextJS 根路径页面

问题描述

我正在为我的玩具项目使用下一个 js。

如果请求 nextjs 的 url 是根路径，它会在 pages 文件夹中找到名为 index.js 的页面。

但是，当他们请求根 url 时，我想向用户显示名为 home.js 的页面，而不是 index.js。

我怎样才能改变它？我想如果我自定义下一个 js 服务器就可以解决。但我想要更简单的方法。可能吗？

标签： reactjsnext.js

解决方案

这在不使用自定义服务器的情况下是可能的，但需要注意的是您必须使用实验性功能 redirects或rewrites取决于您想要构建home.js页面的方式。

例如，如果您只想在用户/home访问根/路径时将其重定向到，您可以next.config.js在项目的根目录中定义重定向规则。

// in next.config.js (should be located in the root of your project if not create one)
module.exports = {
  experimental: {
    async redirects() {
      return [
        { source: '/', destination: '/home', permanent: true }, // a permanent redirect
      ];
    },
  },
};

但是，如果您打算将项目投入生产，我建议现在使用自定义服务器，当它们在稳定分支中可用时使用redirects和功能。rewrites

推荐阅读