لا يمكن عمل build لمشروع next 14

Adham Mahfoud · 22 مارس

السلام عليكم

قمت بعمل مشروع next 14 واستخدمت nex-intl كي أجعل المشروع متعدد اللغات، بعد أن أنهيت المشروع أريد رفعه على github ولكن يظهر لي
⨯ page.tsx doesn't have a root layout. To fix this error, make sure every page has a root layout.
وذلك لأن من خطوات next-intl هو نقل الlayout والpage.tsx إلى مجلد [locale]، قمت بعمل ملف layout ووضعت فيه الكود التالي:

import { ReactNode } from 'react';

interface ErrorProps {
  children: ReactNode;
}

export default function GlobalError({ children }: ErrorProps) {
  return (
    <html>
    <body>
    {children}
    </body>
    </html>
  );
}

ليظهر بعدها هذا الخطأ

Collecting page data  ..Error: ES Modules may not assign module.exports or exports.*, Use ESM export syntax, instead: 5361
    at Object.set [as exports] (D:\testtest\test-app\.next\server\webpack-runtime.js:1:1069)
    at 5361 (D:\testtest\test-app\.next\server\chunks\233.js:3:4871)
    at Function.t (D:\testtest\test-app\.next\server\webpack-runtime.js:1:143)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async collectGenerateParams (D:\testtest\test-app\node_modules\next\dist\build\utils.js:919:21)
    at async D:\testtest\test-app\node_modules\next\dist\build\utils.js:1138:17
    at async Span.traceAsyncFn (D:\testtest\test-app\node_modules\next\dist\trace\trace.js:151:20)

> Build error occurred
Error: Failed to collect page data for /[locale]/cart
    at D:\testtest\test-app\node_modules\next\dist\build\utils.js:1258:15
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  type: 'Error'
}
   Collecting page data  .

قمت بالبحث عن السبب ووجدت أنه يجب إضافة "type" : "module" إلى ملف packege.json، قمت بإضافتها ولم يحصل شيء، بعدها قيل لي يجب التعديل على ملف next.config.mjs قمت بكتابة هذا الكود

import createNextIntlPlugin from 'next-intl/plugin';
 
const withNextIntl = createNextIntlPlugin();
 
const nextConfig = {
  
};

const plugin = withNextIntl(nextConfig);
 
export default plugin;

ثمَّ استطعت عمل build للمشروع ولكن عندما انتقلت إلى github تظهر هذه المشكلة دائماً عند الbuild:

بحثت عن الحل وجدت أنه يجب كتابة output:"export" في ملف next.config.mjs قمت بكتابتها ليظهر لي أنه يجب أن تحتوي الصفحات على getGenerateStatic() لكن عند وضعها لا تعمل ويعطي خطأ لأن الصفحات غير الثابتة لا يجب ان تحتوي على headers.
بالنهاية إذا كنت أريد عمل الموقع static يجب أن أتخلى عن الصفحات الdynamic وإذا كنت أريد الاحتفاظ بصفحات الdynamic لا يمكنني عمل build على github
أرجو المساعدة وشكراً مسبقاً.

Mustafa Suleiman · 29 مارس

تم إزالة أمر "next export" في إصدارات Next.js الحديثة، وعليك استخدام "output: export" في ملف next.config.js.

module.exports = {
  reactStrictMode: true,
  output: 'export',
};

ثم تشغيل أمر npm run build

https://nextjs.org/docs/pages/building-your-application/deploying/static-exports

لا يمكن عمل build لمشروع next 14

السؤال

Adham Mahfoud

1 جواب على هذا السؤال

Recommended Posts

Mustafa Suleiman

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية