Next.js Nextjs动态路由与next-i18next生成错误

我有一个编辑页面，该页面将使用id参数呈现，在应用程序运行时工作正常，但在构建nextjs应用程序时，我遇到了这个错误

[错误：eNote:没有这样的文件或目录，重命名为'C:\Users\Ahsan Nisar\Documents\GitHub\customer portal\frontend.next\export\en\Companys\edit[id].html'->'C:\Users\Ahsan Nisar\Documents\GitHub\customer portal\frontend.next\server\pages\en\Companys\edit[id].html']

完全错误

我不确定这个错误与什么有关，或者我在代码中犯了什么错误，这个错误是在构建时发生的

这是我的页面代码

import { WithAuthorization } from 'common/roq-hocs';
import { MainLayout } from 'layouts';
import { useTranslation } from 'next-i18next';
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
import React, { FunctionComponent } from 'react';
import { CompaniesEditView } from 'views/companies-edit';

const CompanyCreatePage: FunctionComponent = () => {
  const { t } = useTranslation('companiesEdit');
  return (
    <MainLayout title={t('title')}>
      <WithAuthorization
        permissionKey="companies.update"
        failComponent={
          <div className="mt-16 text-2xl text-center text-gray-600">
            <span>{t('noView')}</span>
          </div>
        }
      >
        <CompaniesEditView />
      </WithAuthorization>
    </MainLayout>
  );
};

export const getStaticProps = async ({ locale }) => ({
  props: {
    ...(await serverSideTranslations(locale, ['common', 'companiesEdit'])),
  },
});

export const getStaticPaths = () => ({
  paths: ['/companies/edit/[id]'],
  fallback: true,
});

export default CompanyCreatePage;

从“通用/roq HOC”导入{WithAuthorization}；
从“布局”导入{MainLayout}；
从'next-i18next'导入{UseTransation}；
从“next-i18next/serverSideTranslations”导入{serverSideTranslations}；
从“React”导入React，{FunctionComponent}；
从“视图/公司编辑”导入{CompaniesEditView}；
const CompanyCreatePage:FunctionComponent=（）=>{
const{t}=useTranslation（'companiesEdit'）；
返回(
);
};
export const getStaticProps=async（{locale}）=>({
道具：{
…（等待服务器端翻译（区域设置，['common'，'companyedit']），
},
});
导出常量GetStaticPath=（）=>({
路径：['/companys/edit/[id]']，
回退：没错，
});
导出默认公司创建页面；

我认为问题可能是您没有在

getStaticPaths

函数中返回预期的

路径

模型

此页面的最小示例：

从“下一步”导入{GetStaticPath，GetStaticProps}；
从“下一个/路由器”导入{useRouter}；
const CompanyCreatePage=（）=>{
const router=useRouter（）；
const{id}=router.query；
返回(
公司为id:{id}创建页面内容
);
};
导出常量getStaticPaths:getStaticPaths=async（）=>{
//通过API、文件等获取所有可能的“id”值。
常量ID=['1'，'2'，'3'，'4'，'5']；//示例
const path=ids.map（id=>({
参数：{id}，
}));
返回{路径，回退：false}；
};
导出常量getStaticProps:getStaticProps=异步上下文=>{
返回{props:{}；
};
导出默认公司创建页面；

然后，导航到页面

/users/edit/3/

，返回以下内容

---

考虑到

getstaticpath

中的

fallback

参数会更改

getStaticProps

函数的行为。请参阅

我认为问题可能是您没有在

getStaticPaths

函数中返回预期的

路径

模型

此页面的最小示例：

从“下一步”导入{GetStaticPath，GetStaticProps}；
从“下一个/路由器”导入{useRouter}；
const CompanyCreatePage=（）=>{
const router=useRouter（）；
const{id}=router.query；
返回(
公司为id:{id}创建页面内容
);
};
导出常量getStaticPaths:getStaticPaths=async（）=>{
//通过API、文件等获取所有可能的“id”值。
常量ID=['1'，'2'，'3'，'4'，'5']；//示例
const path=ids.map（id=>({
参数：{id}，
}));
返回{路径，回退：false}；
};
导出常量getStaticProps:getStaticProps=异步上下文=>{
返回{props:{}；
};
导出默认公司创建页面；

然后，导航到页面

/users/edit/3/

，返回以下内容

---

考虑到

getstaticpath

中的

fallback

参数会更改

getStaticProps

函数的行为。作为参考，请参阅

如果我设置了

回退：false

则构建工作正常，但页面无法呈现；如果设置为

true

则页面呈现良好，但构建失败。任何帮助都将得到感谢。它是否在开发模式下工作？@Nilay构建失败，但应用程序在我的本地机器上工作正常如果我设置了

回退：false

然后构建工作，但页面不会被呈现，如果设置为

true

，则页面呈现良好，但构建失败。任何帮助都将得到感谢。它是否在开发模式下工作？@Nilay构建失败，但应用程序在我的本地机器上工作得很好。您的意思是进行graphql api调用（我的后端）这是不可避免的。我试图避免这种情况，这取决于您是否希望在构建时生成所有可用页面。如果您有大量页面，或者希望避免在构建时调用api，可以使用

fallback:true

选项，该选项将通过在运行时运行

getStaticProps

来加载页面的道具。在这种情况下，您必须使用

useRouter

中的

isFallback

处理加载状态。有一个示例演示了这种行为。您可以看到它只传递一个tweet id就可以工作。只需设置

路径：[]

，就可以了。它起作用了，所以您的意思是从GetStaticPath进行GraphQLAPI调用（我的后端）是不可避免的。我试图避免这种情况，这取决于您是否希望在构建时生成所有可用页面。如果您有大量页面，或者希望避免在构建时调用api，可以使用

fallback:true

选项，该选项将通过在运行时运行

getStaticProps

来加载页面的道具。在这种情况下，您必须使用

useRouter

中的

isFallback

处理加载状态。有一个示例演示了这种行为。您可以看到它只传递一个tweet id就可以工作。只需设置

路径：[]

，就可以了。它起作用了