Next.js: TypeError: لا يمكن قراءة الخاصية '_documentProps' للقيمة الخالية

تم إنشاؤها على ٦ ديسمبر ٢٠١٩ · 10تعليقات · مصدر: vercel/next.js

تقرير الشوائب

صف الخلل

TypeError: Cannot read property '_documentProps' of null

يتم طرح هذا في طريقة العرض Head :

render() {
    var {
      styles,
      ampPath,
      inAmpMode,
      assetPrefix,
      hybridAmp,
      canonicalBase,
      __NEXT_DATA__,
      dangerousAsPath,
      headTags
    } = this.context._documentProps;

يعمل بشكل جيد في التطوير ولكن عند إنشاء إصدار الإصدار وتشغيله يتعطل

لإعادة إنتاج

خطوات إعادة إنتاج السلوك ، يرجى توفير مقتطفات التعليمات البرمجية أو المستودع:

أتفهم أن هذا قد يكون شيئًا متعلقًا بإعداداتي. أنا أستخدم الكتابة المطبوعة و nextjs.

سلوك متوقع

لم يتم إلقاء أي خطأ.

معلومات النظام

نظام التشغيل: macOS
متصفح (إن وجد) كروم (أي)
إصدار Next.js: 9.1.4

سياق إضافي

يعمل التطبيق بشكل جيد في 9.0.4 ولكن لدي تبعية تلقي تحذيرًا من الضعف .. ولا ينبغي أن يكون تحديثًا كبيرًا (افترضت).

تظهر المشكلة دائمًا في العنصر الأول داخل المستند في pages / _document. في هذه الحالة "رأسه" ولكن إذا قمت بإزالة "الرأس" فإنه يظهر نفسه في "الرئيسي". بطريقة ما هذا السياق لا يتم ملؤه بالسكان .. فقط عند البناء (يعمل في التطوير)

هذه هي getInitialProps لصفحة _document الخاصة بي:

public static async getInitialProps(context: CustomDocumentContext) {
    const sheet = new ServerStyleSheet();
    const renderPage = context.renderPage;

    try {
      context.renderPage = () => {
        const enhancer = App => props => {
          return sheet.collectStyles(<App {...props} />);
        };

        return renderPage(enhancer);
      };

      const initialProps: any = await BaseDocument.getInitialProps(context);
      const { language, locale, localeData } = context.req;

      return {
        ...initialProps,
        language,
        locale,
        localeData,
        styles: (
          <>
            {initialProps.styles}
            {sheet.getStyleElement()}
          </>
        ),
      };
    } finally {
      // @ts-ignore
      sheet.seal();
    }
  }

please add a complete reproduction

مصدر

joaogarin

التعليق الأكثر فائدة

لقد واجهت نفس المشكلة ، ولست متأكدًا مما إذا كان ذلك مرتبطًا. ولكن ، كانت المشكلة بسبب الاستيراد غير السليم.

بدلاً من import { Head } from 'next/document' ، يجب أن يكون import Head from 'next/head' ، إذا كان أي شخص يحاول استيراد Head داخل الصفحات الفردية ، وليس في _document ، كما هو مذكور في المستندات .

phoenisx في ٩ فبراير ٢٠٢٠

👍108 ❤31 🎉29 🚀17 😄6

ال 10 كومينتر

من المستحيل بشكل أساسي مساعدتك / قول ما يتعلق به حيث لا يتم توفير إعادة إنتاج.

timneutkens في ٨ ديسمبر ٢٠١٩

👀1

هل تستخدم أبولو؟

timneutkens في ٨ ديسمبر ٢٠١٩

يبدو أنه تم إصلاح هذا الأمر مع بعض المُعاد بناء على كود _document.tsx:

const originalRenderPage = context.renderPage;
...
    try {
      context.renderPage = () =>
        originalRenderPage({
          enhanceApp: App => props => sheet.collectStyles(<App {...props} />),
        });

      const initialProps = await BaseDocument.getInitialProps(context);
...

قريب مما ورد في الأمثلة.

مواجهة مشكلات أخرى على الرغم من التحديث من 9.0.4 إلى 9.1.4 .. يبدو أن هذا تحديث غير تافه لسبب ما.

شكرا للمؤشرات على أي حال.

أعلم أنه من الصعب المساعدة بدون بعض إعادة الإنتاج ولكن في بعض الأحيان تصدر نافذة منبثقة لأسباب أخرى ولا تظهر نفسها في سيناريو عالم مرحبًا. يحتوي التطبيق بالطبع على تعليمات برمجية أخرى يمكنها إرسال أشياء غير مرغوب فيها .. وهذا ممكن دائمًا. محاولة تصحيح الأخطاء وتقديم أكبر قدر ممكن من المعلومات دائمًا.

شكرا لك على كل المساعدة سيدي. انت رائع 👍

joaogarin في ٩ ديسمبر ٢٠١٩

لقد واجهت نفس المشكلة ، ولست متأكدًا مما إذا كان ذلك مرتبطًا. ولكن ، كانت المشكلة بسبب الاستيراد غير السليم.

phoenisx في ٩ فبراير ٢٠٢٠

👍108 ❤31 🎉29 🚀17 😄6

@ Shub1427 أنت جميلة ، شكرا!

andresmejia3 في ٦ مارس ٢٠٢٠

🎉3 😄1

@ shub1427 ❤️

Nases في ٩ مارس ٢٠٢٠

👍3 👎1

واو ، لقد أنقذني هذا بعد ما يقرب من يومين من التعثر. أعتقد أن هذا يجب بالتأكيد توثيقه بشكل أفضل.

adrianmcli في ٥ أبريل ٢٠٢٠

بالنسبة لأي شخص يستخدم import Head from 'next/head' لاحظ أنه يبدو أن جميع العلامات يتم عرضها فقط في العميل ، وليس في الخادم

xe4me في ٢٠ يوليو ٢٠٢٠

سأتعامل مع هذا الخطأ
Unhandled error during request: TypeError: Cannot destructure property 'assetPrefix' of 'this.context._documentProps' as it is undefined.
في _document.js الخاص بي عند النشر ولكنه يعمل بشكل جيد محليًا.

sibasishm في ٣١ أغسطس ٢٠٢٠

sibasishm لقد واجهت هذا الخطأ وكان الحل هو القيام بـ this.context بدلاً من this.context._documentProps .

لمزيد من المعلومات → https://github.com/vercel/next.js/discussions/16162

لكني أتلقى خطأً آخر الآن Type error: Property 'files' does not exist on type 'DocumentProps'. لأنني أفعل const { assetPrefix, files } = this.context الآن :(