خيارات next.config.js

يمكن تكوين Next.js من خلال ملف next.config.js في جذر دليل المشروع (على سبيل المثال، بجانب package.json).

/** @type {import('next').NextConfig} */
const nextConfig = {
  /* config options here */
}

module.exports = nextConfig

ملف next.config.js هو وحدة Node.js عادية وليس ملف JSON. يتم استخدامه بواسطة خادم Next.js ومراحل البناء، ولا يتم تضمينه في بناء المتصفح.

إذا كنت بحاجة إلى وحدات ECMAScript، يمكنك استخدام next.config.mjs:

/**
 * @type {import('next').NextConfig}
 */
const nextConfig = {
  /* config options here */
}

export default nextConfig

يمكنك أيضًا استخدام دالة:

module.exports = (phase, { defaultConfig }) => {
  /**
   * @type {import('next').NextConfig}
   */
  const nextConfig = {
    /* config options here */
  }
  return nextConfig
}

منذ Next.js 12.1.0، يمكنك استخدام دالة غير متزامنة:

module.exports = async (phase, { defaultConfig }) => {
  /**
   * @type {import('next').NextConfig}
   */
  const nextConfig = {
    /* config options here */
  }
  return nextConfig
}

phase هو السياق الحالي الذي يتم فيه تحميل التكوين. يمكنك رؤية المراحل المتاحة. يمكن استيراد المراحل من next/constants:

const { PHASE_DEVELOPMENT_SERVER } = require('next/constants')

module.exports = (phase, { defaultConfig }) => {
  if (phase === PHASE_DEVELOPMENT_SERVER) {
    return {
      /* development only config options here */
    }
  }

  return {
    /* config options for all phases except development here */
  }
}

الأسطر المعلقة هي المكان الذي يمكنك وضع التكوينات المسموح بها بواسطة next.config.js، والتي تم تعريفها في هذا الملف.

ومع ذلك، لا يوجد أي من التكوينات مطلوب، وليس من الضروري فهم ما يفعله كل تكوين. بدلاً من ذلك، ابحث عن الميزات التي تحتاج إلى تمكينها أو تعديلها في هذا القسم وسوف تظهر لك ما يجب القيام به.

تجنب استخدام ميزات JavaScript الجديدة غير المتوفرة في إصدار Node.js المستهدف. لن يتم تحليل next.config.js بواسطة Webpack أو Babel أو TypeScript.

توثق هذه الصفحة جميع خيارات التكوين المتاحة: