وضع إطار العمل

يتم دمج وحدة workbox-build في عملية إنشاء مستندة إلى Node، ويمكنها إنشاء مشغّل خدمات كامل أو إنشاء قائمة بالأصول التي يمكن الاحتفاظ بنسخة منها مسبقًا والتي يمكن استخدامها في مشغّل خدمات حالي.

الوضعان اللذان سيستخدمهما معظم المطوّرين هما generateSW وinjectManifest. يمكن أن تساعدك الإجابات عن الأسئلة التالية في اختيار الوضع والإعداد المناسبَين للاستخدام.

الوضع الذي يجب استخدامه

generateSW

ينشئ وضع generateSW ملف عامل خدمة لك، ويتم تخصيصه من خلال خيارات الضبط، ثم يتم كتابته على القرص.

حالات استخدام generateSW

  • إذا كنت تريد الاحتفاظ بنسخة مؤقتة من الملفات
  • إذا كانت لديك احتياجات بسيطة لتخزين المحتوى مؤقتًا أثناء التشغيل

حالات عدم استخدام generateSW

  • إذا كنت تريد استخدام ميزات Service Worker الأخرى (مثل Web Push)
  • إذا أردت استيراد نصوص برمجية إضافية أو إضافة منطق إضافي لاستراتيجيات التخزين المؤقت المخصّصة

injectManifest

سيُنشئ وضع injectManifest قائمة بعناوين URL التي سيتم تخزينها مؤقتًا مسبقًا، وسيضيف بيان التخزين المؤقت المُسبَق هذا إلى ملف عامل خدمة حالي. وإلا، سيبقى الملف كما هو.

حالات استخدام injectManifest

  • إذا كنت تريد التحكّم بشكل أكبر في عامل الخدمة
  • إذا أردت الاحتفاظ بنسخة مؤقتة من الملفات
  • عليك تخصيص عمليات التوجيه والاستراتيجيات.
  • إذا أردت استخدام worker الخدمة مع ميزات أخرى في المنصة (مثل Web Push)

حالات عدم استخدام injectManifest

  • إذا كنت تريد أسهل مسار لإضافة عامل خدمة إلى موقعك الإلكتروني

وضع generateSW

يمكنك استخدام وضع generateSW ضمن نص إنشاء يستند إلى العقدة، باستخدام خيارات الضبط الأكثر شيوعًا، على النحو التالي:

// Inside of build.js:
const {generateSW} = require('workbox-build');

// These are some common options, and not all are required.
// Consult the docs for more info.
generateSW({
  dontCacheBustURLsMatching: [new RegExp('...')],
  globDirectory: '...',
  globPatterns: ['...', '...'],
  maximumFileSizeToCacheInBytes: ...,
  navigateFallback: '...',
  runtimeCaching: [{
    // Routing via a matchCallback function:
    urlPattern: ({request, url}) => ...,
    handler: '...',
    options: {
      cacheName: '...',
      expiration: {
        maxEntries: ...,
      },
    },
  }, {
    // Routing via a RegExp:
    urlPattern: new RegExp('...'),
    handler: '...',
    options: {
      cacheName: '...',
      plugins: [..., ...],
    },
  }],
  skipWaiting: ...,
  swDest: '...',
}).then(({count, size, warnings}) => {
  if (warnings.length > 0) {
    console.warn(
      'Warnings encountered while generating a service worker:',
      warnings.join('\n')
    );
  }

  console.log(`Generated a service worker, which will precache ${count} files, totaling ${size} bytes.`);
});

سيؤدي ذلك إلى إنشاء عامل خدمة مع إعداد التخزين المؤقت المُسبَق لجميع الملفات التي تم اختيارها من خلال الإعدادات وقواعد التخزين المؤقت أثناء التشغيل المقدَّمة.

يمكن العثور على مجموعة كاملة من خيارات الضبط في المستندات المرجعية.

وضع injectManifest

يمكنك استخدام وضع injectManifest ضمن نص إنشاء يستند إلى العقدة، باستخدام خيارات الضبط الأكثر شيوعًا، على النحو التالي:

// Inside of build.js:
const {injectManifest} = require('workbox-build');

// These are some common options, and not all are required.
// Consult the docs for more info.
injectManifest({
  dontCacheBustURLsMatching: [new RegExp('...')],
  globDirectory: '...',
  globPatterns: ['...', '...'],
  maximumFileSizeToCacheInBytes: ...,
  swDest: '...',
  swSrc: '...',
}).then(({count, size, warnings}) => {
  if (warnings.length > 0) {
    console.warn(
      'Warnings encountered while injecting the manifest:',
      warnings.join('\n')
    );
  }

  console.log(`Injected a manifest which will precache ${count} files, totaling ${size} bytes.`);
});

سيؤدي ذلك إلى إنشاء بيان ذاكرة التخزين المؤقت المُسبَق استنادًا إلى الملفات التي تم اختيارها من خلال الإعدادات وإدراجه في ملف الخدمة العامل الحالي.

يمكن العثور على مجموعة كاملة من خيارات الضبط في المستندات المرجعية.

الأوضاع الإضافية

نتوقع أن تلبي generateSW أو injectManifest احتياجات معظم المطوّرين. ومع ذلك، هناك وضع آخر متوافق مع workbox-build قد يكون مناسبًا لحالات استخدام معيّنة.

وضع getManifest

يشبه هذا الأسلوب من الناحية المفاهيمية وضع injectManifest، ولكن بدلاً من إضافة البيان إلى ملف عامل الخدمة المصدر، يعرض صفيف إدخالات البيان، بالإضافة إلى معلومات عن عدد الإدخالات والحجم الإجمالي.

يمكنك استخدام وضع injectManifest ضمن نص برمجي لإنشاء يستند إلى العقدة، باستخدام خيارات الإعداد الأكثر شيوعًا، على النحو التالي:

// Inside of build.js:
const {getManifest} = require('workbox-build');

// These are some common options, and not all are required.
// Consult the docs for more info.
getManifest({
  dontCacheBustURLsMatching: [new RegExp('...')],
  globDirectory: '...',
  globPatterns: ['...', '...'],
  maximumFileSizeToCacheInBytes: ...,
}).then(({manifestEntries, count, size, warnings}) => {
  if (warnings.length > 0) {
    console.warn(
      'Warnings encountered while getting the manifest:',
      warnings.join('\n')
    );
  }

  // Do something with the manifestEntries, and potentially log count and size.
});

يمكن العثور على مجموعة كاملة من خيارات الضبط في المستندات المرجعية.

الأنواع

BasePartial

أماكن إقامة

  • additionalManifestEntries

    (string | ManifestEntry)[] اختياري

    قائمة بالإدخالات التي سيتم تخزينها مؤقتًا مسبقًا، بالإضافة إلى أي إدخالات يتم إنشاؤها كجزء من إعدادات التصميم

  • dontCacheBustURLsMatching

    تعبير عادي اختياري

    سيتم افتراض أنّ مواد العرض التي تتطابق مع هذا العنوان لها إصدار فريد من خلال عنوان URL الخاص بها، وستُستثنى من ميزة "إلغاء ذاكرة التخزين المؤقت" العادية لبروتوكول HTTP التي يتم تنفيذها عند ملء ذاكرة التخزين المؤقت المُسبَق. على الرغم من أنّ ذلك ليس مطلوبًا، ننصحك في حال كانت عملية الإنشاء الحالية تُدرج قيمة [hash] في كل اسم ملف، بتقديم تعبير عادي سيرصد ذلك، لأنّ ذلك سيقلّل من معدل نقل البيانات المستخدَم عند التخزين المؤقت المُسبَق.

  • manifestTransforms

    ManifestTransform[] اختياري

    دالة واحدة أو أكثر سيتم تطبيقها بشكل تسلسلي على البيان الذي تم إنشاؤه. إذا تم تحديد modifyURLPrefix أو dontCacheBustURLsMatching أيضًا، سيتم تطبيق عمليات التحويل المقابلة أولاً.

  • maximumFileSizeToCacheInBytes

    رقم اختياري

    القيمة التلقائية هي: 2097152

    يمكن استخدام هذه القيمة لتحديد الحد الأقصى لحجم الملفات التي سيتم تخزينها مسبقًا. ويمنعك ذلك من تخزين ملفات كبيرة جدًا مسبقًا بدون قصد قد تتطابق عن طريق الخطأ مع أحد أنماطك.

  • modifyURLPrefix

    العنصر اختياري

    سلسلة تعيين عنصر تُضيف بادئات إلى قيم سلاسل الاستبدال. يمكن استخدام هذه الميزة مثلاً لإزالة بادئة مسار أو إضافتها من إدخال بيان إذا كان إعداد استضافة الويب لا يتطابق مع إعداد نظام الملفات على الجهاز. كبديلٍ يتمتع بمرونة أكبر، يمكنك استخدام الخيار manifestTransforms وتقديم دالة تعدّل الإدخالات في البيان باستخدام أي منطق تقدّمه.

    مثال على الاستخدام:

    // Replace a '/dist/' prefix with '/', and also prepend
    // '/static' to every URL.
    modifyURLPrefix: {
      '/dist/': '/',
      '': '/static',
    }
    

BuildResult

النوع

حذف<GetManifestResult"manifestEntries"
> & العنصر

أماكن إقامة

  • filePaths

    string[]

GeneratePartial

أماكن إقامة

  • babelPresetEnvTargets

    سلسلة اختيارية

    القيمة التلقائية هي: ["chrome >= 56"]

    الاستهدافات التي يتم تمريرها إلى babel-preset-env عند تحويل حِزمة worker الخدمة

  • cacheId

    سلسلة اختيارية

    معرّف اختياري ليتمّ إرفاقه بأسماء ذاكرة التخزين المؤقت يكون ذلك مفيدًا في المقام الأول لعمليات تطوير التطبيقات على الأجهزة المحلية التي قد يتم عرض مواقع متعددة منها من المصدر نفسه http://localhost:port.

  • cleanupOutdatedCaches

    منطقي اختياري

    القيمة التلقائية هي: false

    ما إذا كان يجب أن يحاول Workbox تحديد أي ذاكرات تخزين مؤقت مُسبَقة تم إنشاؤها بواسطة إصدارات قديمة غير متوافقة وإزالتها.

  • clientsClaim

    منطقي اختياري

    القيمة التلقائية هي: false

    ما إذا كان يجب أن يبدأ عامل الخدمة في التحكّم في أي عملاء حاليين فور تفعيله

  • directoryIndex

    سلسلة اختيارية

    إذا تعذّر مطابقة طلب التنقّل لعنوان URL ينتهي بـ / مع عنوان URL تم تخزينه مسبقًا، سيتم إلحاق هذه القيمة بعنوان URL وسيتم التحقّق من مطابقة التخزين المُسبَق. يجب ضبط هذا الخيار على القيمة التي يستخدمها خادم الويب في فهرس الدليل.

  • disableDevLogs

    منطقي اختياري

    القيمة التلقائية هي: false

  • ignoreURLParametersMatching

    RegExp[] اختيارية

    ستتم إزالة أيّ أسماء لمَعلمات بحث تتطابق مع أحد التعبيرات العادية في هذه السلسلة قبل البحث عن مطابقة في ذاكرة التخزين المؤقت المُسبَق. يكون ذلك مفيدًا إذا كان المستخدمون قد يطلبون عناوين URL تحتوي على مَعلمات عناوين URL مثلاً تُستخدَم لتتبُّع مصدر الزيارات. إذا لم يتم تقديم القيمة، ستكون القيمة التلقائية هي [/^utm_/, /^fbclid$/].

  • importScripts

    سلسلة اختيارية

    قائمة بملفات JavaScript التي يجب تمريرها إلى importScripts() داخل ملف worker الذي تم إنشاؤه يكون ذلك مفيدًا عندما تريد السماح لواجهة Workbox بإنشاء ملف عامل الخدمة من المستوى الأعلى، ولكنك تريد تضمين بعض الرموز البرمجية الإضافية، مثل مستمع أحداث الإرسال الفوري.

  • inlineWorkboxRuntime

    منطقي اختياري

    القيمة التلقائية هي: false

    ما إذا كان يجب تضمين رمز التشغيل لمكتبة Workbox في عامل الخدمة من المستوى الأعلى، أو تقسيمه إلى ملف منفصل يجب نشره إلى جانب عامل الخدمة ويؤدي فصل وقت التشغيل إلى عدم اضطرار المستخدمين إلى إعادة تنزيل رمز Workbox في كل مرة يتم فيها تغيير عامل الخدمة من المستوى الأعلى.

  • الوضع

    سلسلة اختيارية

    القيمة التلقائية هي: "production"

    في حال ضبطها على "الإصدار العلني"، سيتم إنشاء حِزمة عامل خدمة محسّنة تُستبعد معلومات تصحيح الأخطاء. في حال عدم ضبط القيمة صراحةً هنا، سيتم استخدام القيمة process.env.NODE_ENV، وفي حال عدم توفّرها، ستتم الرجوع إلى القيمة 'production'.

  • navigateFallback

    سلسلة اختيارية

    القيمة التلقائية هي: null

    في حال تحديده، سيتم تنفيذ جميع طلبات التنقّل لعناوين URL التي لم يتم تخزينها مؤقتًا باستخدام رمز HTML في عنوان URL الذي تم تقديمه. يجب إدخال عنوان URL لمستند HTML مُدرَج في بيان التخزين المؤقت المُسبَق. يُقصد استخدام هذا الإجراء في أحد سيناريوهات التطبيقات المكوّنة من صفحة واحدة، حيث تريد أن تستخدم جميع عمليات التنقّل رمز HTML المشترَك لإطار التطبيق.

  • navigateFallbackAllowlist

    RegExp[] اختيارية

    صفيف اختياري من التعبيرات العادية التي تحدّ من عناوين URL التي ينطبق عليها navigateFallback الذي تم ضبطه يكون هذا مفيدًا إذا كان يجب التعامل مع مجموعة فرعية فقط من عناوين URL لموقعك الإلكتروني على أنّها جزء من تطبيق صفحة واحدة. في حال ضبط كل منnavigateFallbackDenylist وnavigateFallbackAllowlist، يكون للقائمة المحظورة الأولوية.

    ملاحظة: قد يتم تقييم تعبيرات RegExp هذه مقابل كل عنوان URL للوجهة أثناء التنقّل. تجنَّب استخدام التعبيرات العادية المعقدة، وإلا قد يواجه المستخدمون تأخيرات عند التنقّل في موقعك الإلكتروني.

  • navigateFallbackDenylist

    RegExp[] اختيارية

    صفيف اختياري من التعبيرات العادية التي تحدّ من عناوين URL التي ينطبق عليها navigateFallback الذي تم ضبطه يكون هذا مفيدًا إذا كان يجب التعامل مع مجموعة فرعية فقط من عناوين URL لموقعك الإلكتروني على أنّها جزء من تطبيق صفحة واحدة. في حال ضبط كل منnavigateFallbackDenylist وnavigateFallbackAllowlist، تُمنَح القائمة المحظورة الأولوية.

    ملاحظة: قد يتم تقييم تعبيرات RegExp هذه مقابل كل عنوان URL للوجهة أثناء التنقّل. تجنَّب استخدام التعبيرات العادية المعقدة، وإلا قد يواجه المستخدمون تأخيرات عند التنقّل في موقعك الإلكتروني.

  • navigationPreload

    منطقي اختياري

    القيمة التلقائية هي: false

    ما إذا كان سيتم تفعيل التحميل المُسبَق للتنقّل في الخدمة العاملة التي تم إنشاؤها. عند ضبط القيمة على "صحيح"، يجب أيضًا استخدام runtimeCaching لإعداد استراتيجية استجابة مناسبة تتطابق مع طلبات التنقّل، والاستفادة من الردّ المحمَّل مسبقًا.

  • offlineGoogleAnalytics

    منطقي | GoogleAnalyticsInitializeOptions اختياري

    القيمة التلقائية هي: false

    يتحكّم هذا الخيار في ما إذا كان سيتم تضمين ميزة التوافق مع "إحصاءات Google" بلا إنترنت أم لا. عند true، تتم إضافة طلب initialize() في workbox-google-analytics إلى عامل الخدمة الذي تم إنشاؤه. عند ضبطه على Object، سيتم تمرير هذا العنصر إلى طلب initialize()، ما يتيح لك تخصيص السلوك.

  • runtimeCaching

    RuntimeCaching[] اختياري

    عند استخدام أدوات الإنشاء في Workbox لإنشاء عامل الخدمة، يمكنك تحديد أحد إعدادات التخزين المؤقت أثناء التشغيل أو أكثر. ويتم بعد ذلك تحويلها إلى طلبات workbox-routing.registerRoute باستخدام إعدادات المطابقة والمعالج التي تحدّدها.

    للاطّلاع على جميع الخيارات، يُرجى الاطّلاع على مستندات workbox-build.RuntimeCaching. يوضّح المثال أدناه إعدادًا نموذجيًا، مع تحديد مجريتَي تنفيذ:

  • skipWaiting

    منطقي اختياري

    القيمة التلقائية هي: false

    ما إذا كان سيتمّ إضافة طلب غير مشروط إلى skipWaiting() إلى عامل الخدمة الذي تم إنشاؤه. إذا كان false، سيتم بدلاً من ذلك إضافة مستمع message، ما يسمح لصفحات العميل بتشغيل skipWaiting() من خلال استدعاء postMessage({type: 'SKIP_WAITING'}) في عامل خدمة في انتظار.

  • sourcemap

    منطقي اختياري

    القيمة التلقائية هي: true

    ما إذا كان سيتم إنشاء خريطة مصادر لملفات الخدمة التي تم إنشاؤها

GenerateSWOptions

GetManifestOptions

GetManifestResult

أماكن إقامة

  • العدد

    الرقم

  • manifestEntries
  • الحجم

    الرقم

  • تحذيرات

    string[]

GlobPartial

أماكن إقامة

  • globFollow

    منطقي اختياري

    القيمة التلقائية هي: true

    تحدِّد ما إذا كان سيتم اتّباع الروابط الرمزية أم لا عند إنشاء ملف بيان التخزين المؤقت. لمزيد من المعلومات، يُرجى الاطّلاع على تعريف follow في مستندات glob.

  • globIgnores

    سلسلة اختيارية

    القيمة التلقائية هي: ["**\/node_modules\/**\/*"]

    مجموعة من الأنماط التي تتطابق مع الملفات المطلوب استبعادها دائمًا عند إنشاء بيان التخزين المؤقت المُسبَق لمزيد من المعلومات، يُرجى الاطّلاع على تعريف ignore في مستندات glob.

  • globPatterns

    سلسلة اختيارية

    القيمة التلقائية هي: ["**\/*.{js,wasm,css,html}"]

    سيتم تضمين الملفات التي تتطابق مع أيٍّ من هذه الأنماط في بيان التوقّع المُسبَق للتحميل. لمزيد من المعلومات، يمكنك الاطّلاع على glob.

  • globStrict

    منطقي اختياري

    القيمة التلقائية هي: true

    إذا كان هذا الخيار صحيحًا، سيؤدي خطأ في قراءة دليل عند إنشاء بيان التخزين المؤقت المُسبَق إلى تعذُّر عملية الإنشاء. إذا كانت القيمة خطأ، سيتمتخطّي الدليل الذي يتضمّن مشكلة. لمزيد من المعلومات، اطّلِع على تعريف strict في glob المستندات.

  • templatedURLs

    العنصر اختياري

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

InjectManifestOptions

InjectPartial

أماكن إقامة

  • injectionPoint

    سلسلة اختيارية

    القيمة التلقائية هي: "self.__WB_MANIFEST"

    السلسلة المطلوب العثور عليها داخل ملف swSrc بعد العثور عليه، سيتم استبداله ببيان التخزين المؤقت الذي تم إنشاؤه.

  • swSrc

    سلسلة

    مسار ملف عامل الخدمة واسمه الذي سيتم قراءته أثناء عملية الإنشاء، بالنسبة إلى دليل العمل الحالي

ManifestEntry

أماكن إقامة

  • السلامة

    سلسلة اختيارية

  • مراجعة

    سلسلة

  • url

    سلسلة

ManifestTransform()

workbox-build.ManifestTransform(
  manifestEntries: (ManifestEntry & object)[],
  compilation?: unknown,
)

النوع

دالة

المعلمات

  • manifestEntries

    (ManifestEntry & object)[]

    • الحجم

      الرقم

  • تجميع

    غير معروف اختياري

المرتجعات

ManifestTransformResult

أماكن إقامة

  • البيان

    (ManifestEntry & object)[]

    • الحجم

      الرقم

  • تحذيرات

    سلسلة اختيارية

OptionalGlobDirectoryPartial

أماكن إقامة

  • globDirectory

    سلسلة اختيارية

    الدليل المحلي الذي تريد مطابقة globPatterns معه. يكون المسار نسبيًا للدليل الحالي.

RequiredGlobDirectoryPartial

أماكن إقامة

  • globDirectory

    سلسلة

    الدليل المحلي الذي تريد مطابقة globPatterns معه. يكون المسار نسبيًا للدليل الحالي.

RequiredSWDestPartial

أماكن إقامة

  • swDest

    سلسلة

    مسار واسم ملف الخدمة الذي سيتم إنشاؤه من قِبل عملية الإنشاء، بالنسبة إلى دليل العمل الحالي. يجب أن ينتهي بـ "‎.js".

RuntimeCaching

أماكن إقامة

  • يحدّد هذا الإعداد كيفية إنشاء مسار التشغيل استجابةً. لاستخدام أحد workbox-strategies المضمّنة، أدخِل اسمه، مثل 'NetworkFirst'. بدلاً من ذلك، يمكن أن تكون هذه دالة callback workbox-core.RouteHandler مع منطق استجابة مخصّص.

  • method

    HTTPMethod اختياري

    القيمة التلقائية هي: "GET"

    طريقة HTTP المطلوب مطابقتها. تكون القيمة التلقائية 'GET' عادةً مُرضية، ما لم تكن بحاجة إلى مطابقة 'POST' أو 'PUT' أو نوع آخر من الطلبات بشكل صريح.

  • الخيارات

    العنصر اختياري

  • urlPattern

    سلسلة | تعبير عادي | RouteMatchCallback

    تحدِّد معايير المطابقة هذه ما إذا كان المعالج الذي تم ضبطه سيُنشئ استجابة لأي طلبات لا تتطابق مع أحد عناوين URL التي تم تخزينها مؤقتًا. إذا تم تحديد مسارات RuntimeCaching متعددة، سيكون المسار الأول الذي تتم مطابقة urlPattern له هو المسار الذي يقدّم استجابة.

    يتم ربط هذه القيمة مباشرةً بالمَعلمة الأولى التي تم تمريرها إلى workbox-routing.registerRoute. ننصحك باستخدام دالة workbox-core.RouteMatchCallback للحصول على أكبر قدر من المرونة.

StrategyName

Enum

"CacheFirst"

"CacheOnly"

"NetworkFirst"

"NetworkOnly"

"StaleWhileRevalidate"

WebpackGenerateSWOptions

WebpackGenerateSWPartial

أماكن إقامة

  • importScriptsViaChunks

    سلسلة اختيارية

    اسم واحد أو أكثر من أجزاء webpack سيتم تضمين محتوى هذه الأجزاء في الخدمة العاملة التي تم إنشاؤها، وذلك من خلال طلب إلى importScripts().

  • swDest

    سلسلة اختيارية

    القيمة التلقائية هي: "service-worker.js"

    اسم مادة العرض لملف الخدمة الذي أنشأه هذا المكوّن الإضافي.

WebpackInjectManifestOptions

WebpackInjectManifestPartial

أماكن إقامة

  • compileSrc

    منطقي اختياري

    القيمة التلقائية هي: true

    عند ضبط القيمة على true (القيمة التلقائية)، سيتم تجميع ملف swSrc بواسطة webpack. عند false، لن يتم إجراء عملية التجميع (ولن يكون بإمكانك استخدام webpackCompilationPlugins ). اضبط القيمة على false إذا كنت تريد إدراج البيان في ملف JSON مثلاً.

  • swDest

    سلسلة اختيارية

    اسم مادة العرض لملف الخدمة الذي سينشئه هذا المكوّن الإضافي. في حال حذف هذا الحقل، سيتم الاعتماد على اسم swSrc.

  • webpackCompilationPlugins

    أيّ[] اختيارية

    مكونات webpack إضافية اختيارية سيتم استخدامها عند تجميع swSrc ملف الإدخال. لا يكون صالحًا إلا إذا كان compileSrc يساوي true.

WebpackPartial

أماكن إقامة

  • أجزاء

    سلسلة اختيارية

    اسم جزء واحد أو أكثر يجب تضمين ملفات الإخراج المقابلة له في بيان التخزين المؤقت المُسبَق

  • استبعاد

    (string | RegExp | function)[] اختيارية

    عنصر تحديد واحد أو أكثر يُستخدَم لاستبعاد مواد العرض من بيان التخزين المؤقت المُسبَق ويتم تفسير ذلك باتّباع القواعد نفسها المُستخدَمة في خيار exclude العادي في webpack. وإذا لم يتم تقديمها، تكون القيمة التلقائية هي [/\.map$/, /^manifest.*\.js$].

  • excludeChunks

    سلسلة اختيارية

    اسم جزء واحد أو أكثر يجب استبعاد ملفات الإخراج المقابلة له من بيان التخزين المؤقت المُسبَق

  • تتضمّن

    (string | RegExp | function)[] اختيارية

    مُحدِّد واحد أو أكثر يُستخدَم لتضمين مواد العرض في بيان التخزين المؤقت المُسبَق ويتم تفسير ذلك باتّباع القواعد نفسها المُستخدَمة في خيار include العادي في webpack.

  • الوضع

    سلسلة اختيارية

    في حال ضبطها على "الإصدار العلني"، سيتم إنشاء حِزمة عامل خدمة محسّنة تُستبعد معلومات تصحيح الأخطاء. في حال عدم ضبطها صراحةً هنا، سيتم استخدام قيمة mode التي تم ضبطها في عملية تجميع webpack الحالية.

الطُرق

copyWorkboxLibraries()

workbox-build.copyWorkboxLibraries(
  destDirectory: string,
)

يؤدي ذلك إلى نسخ مجموعة من مكتبات وقت التشغيل التي تستخدمها Workbox إلى ملف directory محلي، والذي يجب نشره إلى جانب ملف worker الخدمة.

كبديل عن نشر هذه النُسخ المحلية، يمكنك بدلاً من ذلك استخدام Workbox من عنوان URL الرسمي لشبكة CDN.

تم توفير هذه الطريقة لمنفعة المطوّرين الذين يستخدمون workbox-build.injectManifest ويفضّلون عدم استخدام نُسخ Workbox من شبكة توصيل المحتوى (CDN). لا يحتاج المطوّرون الذين يستخدمون workbox-build.generateSW إلى استدعاء هذه الطريقة صراحةً.

المعلمات

  • destDirectory

    سلسلة

    المسار إلى الدليل الرئيسي الذي سيتم إنشاء الدليل الجديد للمكتبات ضمنه

المرتجعات

  • Promise<string>

    اسم الدليل الذي تم إنشاؤه حديثًا.

generateSW()

workbox-build.generateSW(
  config: GenerateSWOptions,
)

تنشئ هذه الطريقة قائمة بعناوين URL التي سيتم تخزينها مؤقتًا مسبقًا، ويُشار إليها باسم "بيان تخزين مؤقت مسبق"، استنادًا إلى الخيارات التي تقدّمها.

ويأخذ هذا الإجراء أيضًا في الاعتبار خيارات إضافية لضبط سلوك عامل الخدمة، مثل أي قواعد runtimeCaching يجب استخدامه.

استنادًا إلى بيان التخزين المؤقت المُسبَق والإعدادات الإضافية، يُكتب ملف عامل خدمة جاهز للاستخدام على القرص في swDest.

// The following lists some common options; see the rest of the documentation
// for the full set of options and defaults.
const {count, size, warnings} = await generateSW({
  dontCacheBustURLsMatching: [new RegExp('...')],
  globDirectory: '...',
  globPatterns: ['...', '...'],
  maximumFileSizeToCacheInBytes: ...,
  navigateFallback: '...',
  runtimeCaching: [{
    // Routing via a matchCallback function:
    urlPattern: ({request, url}) => ...,
    handler: '...',
    options: {
      cacheName: '...',
      expiration: {
        maxEntries: ...,
      },
    },
  }, {
    // Routing via a RegExp:
    urlPattern: new RegExp('...'),
    handler: '...',
    options: {
      cacheName: '...',
      plugins: [..., ...],
    },
  }],
  skipWaiting: ...,
  swDest: '...',
});

المعلمات

المرتجعات

getManifest()

workbox-build.getManifest(
  config: GetManifestOptions,
)

تعرض هذه الطريقة قائمة بعناوين URL التي سيتم تخزينها مؤقتًا مسبقًا، ويُشار إليها باسم "ملف بيان التخزين المؤقت المُسبَق"، بالإضافة إلى تفاصيل عن عدد الإدخالات وحجمها، وذلك استنادًا إلى الخيارات التي تقدّمها.

// The following lists some common options; see the rest of the documentation
// for the full set of options and defaults.
const {count, manifestEntries, size, warnings} = await getManifest({
  dontCacheBustURLsMatching: [new RegExp('...')],
  globDirectory: '...',
  globPatterns: ['...', '...'],
  maximumFileSizeToCacheInBytes: ...,
});

المعلمات

المرتجعات

getModuleURL()

workbox-build.getModuleURL(
  moduleName: string,
  buildType: BuildType,
)

المعلمات

  • moduleName

    سلسلة

  • buildType

    BuildType

المرتجعات

  • سلسلة

injectManifest()

workbox-build.injectManifest(
  config: InjectManifestOptions,
)

تنشئ هذه الطريقة قائمة بعناوين URL التي سيتم تخزينها مؤقتًا مسبقًا، ويُشار إليها باسم "بيان التخزين المؤقت المُسبَق"، استنادًا إلى الخيارات التي تقدّمها.

يتمّ إدراج البيان في ملف swSrc، وتحدّد سلسلة العنصر النائب injectionPoint المكان الذي يجب أن يظهر فيه البيان في الملف.

يتم كتابة ملف مشغّل الخدمات النهائي، الذي تمّت فيه إضافة البيان، على الجهاز في swDest.

لن تؤدي هذه الطريقة إلى تجميع ملف swSrc أو تجميعه، بل ستتولى فقط حقن البيان.

// The following lists some common options; see the rest of the documentation
// for the full set of options and defaults.
const {count, size, warnings} = await injectManifest({
  dontCacheBustURLsMatching: [new RegExp('...')],
  globDirectory: '...',
  globPatterns: ['...', '...'],
  maximumFileSizeToCacheInBytes: ...,
  swDest: '...',
  swSrc: '...',
});

المعلمات

المرتجعات