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

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

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

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

generateSW

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

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

  • أردت التخزين المؤقت المسبق للملفات.
  • لديك احتياجات بسيطة للتخزين المؤقت أثناء التشغيل.

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

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

injectManifest

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

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

  • تريد المزيد من التحكّم في عامل الخدمة.
  • أردت التخزين المؤقت المسبق للملفات.
  • عليك تخصيص التوجيه والاستراتيجيات.
  • تريد استخدام عامل الخدمة مع ميزات أخرى في النظام الأساسي (مثل 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 التي يتم تنفيذها عند ملء ذاكرة التخزين المؤقت المسبق. على الرغم من أنّ ذلك ليس مطلوبًا، ننصحك بتقديم تعبير عادي (RegExp) يرصد قيمة [hash] إذا كانت عملية التصميم الحالية تُدرجها في كل اسم ملف، لأنّ ذلك سيقلّل من معدل نقل البيانات المستخدَم عند التخزين المؤقت المسبق.

  • manifestTransforms

    ManifestTransform[] اختياري

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

  • maximumFileSizeToCacheInBytes

    number اختياري

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

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

  • modifyURLPrefix

    عنصر اختياري

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

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

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

BuildResult

النوع

Omit<GetManifestResult"manifestEntries"
> & object

الخصائص

  • filePaths

    string[]

GeneratePartial

الخصائص

  • babelPresetEnvTargets

    string[] اختياري

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

    الأهداف التي سيتم تمريرها إلى babel-preset-env عند تحويل حزمة Service Worker.

  • cacheId

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

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

  • cleanupOutdatedCaches

    boolean اختياري

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

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

  • clientsClaim

    boolean اختياري

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

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

  • directoryIndex

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

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

  • disableDevLogs

    boolean اختياري

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

  • ignoreURLParametersMatching

    RegExp[] اختياري

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

  • importScripts

    string[] اختياري

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

  • inlineWorkboxRuntime

    boolean اختياري

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

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

  • الوضع

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

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

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

  • navigateFallback

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

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

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

  • navigateFallbackAllowlist

    RegExp[] اختياري

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

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

  • navigateFallbackDenylist

    RegExp[] اختياري

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

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

  • navigationPreload

    boolean اختياري

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

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

  • offlineGoogleAnalytics

    boolean | GoogleAnalyticsInitializeOptions اختياري

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

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

  • runtimeCaching

    RuntimeCaching[] اختياري

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

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

  • skipWaiting

    boolean اختياري

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

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

  • sourcemap

    boolean اختياري

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

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

GenerateSWOptions

النوع

‫BasePartial وGlobPartial وGeneratePartial وRequiredSWDestPartial وOptionalGlobDirectoryPartial

GetManifestOptions

النوع

‫BasePartial وGlobPartial وRequiredGlobDirectoryPartial

GetManifestResult

الخصائص

  • العدد

    الرقم

  • manifestEntries

    ManifestEntry[]

  • الحجم

    الرقم

  • تحذيرات

    string[]

GlobPartial

الخصائص

  • globFollow

    boolean اختياري

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

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

  • globIgnores

    string[] اختياري

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

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

  • globPatterns

    string[] اختياري

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

    سيتم تضمين الملفات التي تتطابق مع أي من هذه الأنماط في بيان التخزين المؤقت المسبق. لمزيد من المعلومات، يُرجى الاطّلاع على glob primer.

  • templatedURLs

    عنصر اختياري

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

InjectManifestOptions

النوع

‫BasePartial وGlobPartial وInjectPartial وRequiredSWDestPartial وRequiredGlobDirectoryPartial

InjectPartial

الخصائص

  • injectionPoint

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

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

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

  • swSrc

    سلسلة

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

ManifestEntry

الخصائص

  • النزاهة

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

  • المراجعة

    سلسلة

  • url

    سلسلة

ManifestTransform()

workbox-build.ManifestTransform(
  manifestEntries: (ManifestEntry & object)[],
  compilation?: unknown,
): Promise<ManifestTransformResult> | ManifestTransformResult

النوع

دالة

المعلمات

  • manifestEntries

    (ManifestEntry & object)[]

    • الحجم

      الرقم

  • التحويل البرمجي

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

المرتجعات

ManifestTransformResult

الخصائص

  • البيان

    (ManifestEntry & object)[]

    • الحجم

      الرقم

  • تحذيرات

    string[] اختياري

OptionalGlobDirectoryPartial

الخصائص

  • globDirectory

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

    الدليل المحلي الذي تريد مطابقة globPatterns معه. المسار نسبي إلى الدليل الحالي.

RequiredGlobDirectoryPartial

الخصائص

  • globDirectory

    سلسلة

    الدليل المحلي الذي تريد مطابقة globPatterns معه. المسار نسبي إلى الدليل الحالي.

RequiredSWDestPartial

الخصائص

  • swDest

    سلسلة

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

RuntimeCaching

الخصائص

  • المعالج

    RouteHandler | StrategyName

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

  • method

    HTTPMethod اختياري

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

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

  • الخيارات

    عنصر اختياري

  • urlPattern

    string | RegExp | RouteMatchCallback

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

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

StrategyName

Enum

"CacheFirst"

"CacheOnly"

"NetworkFirst"

"NetworkOnly"

"StaleWhileRevalidate"

WebpackGenerateSWOptions

النوع

‫BasePartial وWebpackPartial وGeneratePartial وWebpackGenerateSWPartial

WebpackGenerateSWPartial

الخصائص

  • importScriptsViaChunks

    string[] اختياري

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

  • swDest

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

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

    اسم ملف Service Worker الذي أنشأه هذا المكوّن الإضافي.

WebpackInjectManifestOptions

النوع

‫BasePartial وWebpackPartial وInjectPartial وWebpackInjectManifestPartial

WebpackInjectManifestPartial

الخصائص

  • compileSrc

    boolean اختياري

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

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

  • swDest

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

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

  • webpackCompilationPlugins

    any[] اختيارية

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

WebpackPartial

الخصائص

  • قِطَع

    string[] اختياري

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

  • استبعاد

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

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

  • excludeChunks

    string[] اختياري

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

  • تتضمّن

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

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

  • الوضع

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

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

الطُرق

copyWorkboxLibraries()

workbox-build.copyWorkboxLibraries(
  destDirectory: string,
): Promise<string>

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

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

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

المعلمات

  • destDirectory

    سلسلة

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

المرتجعات

  • Promise<string>

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

generateSW()

workbox-build.generateSW(
  config: GenerateSWOptions,
): Promise<BuildResult>

تنشئ هذه الطريقة قائمة بعناوين 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,
): Promise<GetManifestResult>

تعرض هذه الطريقة قائمة بعناوين 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,
): string

المعلمات

  • moduleName

    سلسلة

  • buildType

    BuildType

المرتجعات

  • سلسلة

injectManifest()

workbox-build.injectManifest(
  config: InjectManifestOptions,
): Promise<BuildResult>

تنشئ هذه الطريقة قائمة بعناوين 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: '...',
});

المعلمات

المرتجعات