如何在index.html中使用getStaticPaths生成Next.js？

Question

我试图在index.html中使用getStaticPaths生成一个Next.JS页面，但是每次尝试这样做时，它都会抛出一个错误，或者创建一个index目录而不是一个文件。

到目前为止，我已经试过了：''，'/'和'index'在params.page。我还尝试在trailingSlash: true,文件中添加next.config，但这也不起作用。

我在页面目录中有一个[page].js文件。使用这个文件，我会生成许多页面，因为[page].js文件是一个模板文件。我使用这个模板方法是因为有很多常见的组件，每个页面唯一不同的地方就是“主内容”。想象一下，生成10个页面，其中每个页面都有相同的导航条和侧菜单，但内容(文本)不同。所以我试着生成10个页面，其中一个是index.html页面，但是它不是生成一个.html文件，而是生成一个index目录。我该怎么解决这是我的问题？

export const getStaticPaths = async () => {
    return {
        paths: [{
            params: { // Imagine the following code for another 9 pages
                page: 'index' // Only the `index` one has a problem (creates a directory instead of file)
            }
        }]
    };
}

如果我在index中传递除params.page之外的任何其他字符串，它将创建一个[my_string].html页面。我希望能够使用next.js的getStaticPaths方法创建一个getStaticPaths页面。

Answer 1

答案可能有点晚了，但是NextJS增加了一个可选的捕获所有路由。

现在您可以使用两个方括号[[...slug]]命名您的页面。

在get静态道具上，params将是一个空对象，不具有弹状体属性，因此您可以执行以下检查：

export const getStaticProps: GetStaticProps<{ data: PageData }> = async ({ params }) => {
  const homePage = !!!params.url;

  // now do your logic if the page is the home.

请在这里核对我的问题：

https://github.com/vercel/next.js/discussions/34311#discussioncomment-2178744