작업 상자 빌드

workbox-build 모듈은 노드 기반 빌드 프로세스에 통합되며 전체 서비스 워커를 생성하거나 기존 서비스 워커 내에서 사용할 수 있는 사전 캐시할 애셋 목록을 생성할 수 있습니다.

대부분의 개발자가 사용하게 될 두 가지 모드는 generateSW와 injectManifest입니다. 다음 질문에 대한 답변은 사용할 모드와 구성을 선택하는 데 도움이 될 수 있습니다.

사용할 모드

generateSW

generateSW 모드는 구성 옵션을 통해 맞춤설정된 서비스 워커 파일을 만들고 디스크에 씁니다.

generateSW 사용 시점

  • 파일을 사전 캐시하려고 합니다.
  • 간단한 런타임 캐싱 요구사항이 있습니다.

generateSW를 사용하면 안 되는 경우

  • 다른 서비스 워커 기능 (예: 웹 푸시)을 사용하려고 합니다.
  • 추가 스크립트를 가져오거나 커스텀 캐싱 전략을 위한 로직을 추가하려고 합니다.

injectManifest

injectManifest 모드는 사전 캐시할 URL 목록을 생성하고 이 사전 캐시 매니페스트를 기존 서비스 워커 파일에 추가합니다. 그렇지 않으면 파일이 그대로 유지됩니다.

injectManifest 사용 시점

  • 서비스 워커를 더 세부적으로 제어하려는 경우.
  • 파일을 사전 캐시하려고 합니다.
  • 라우팅 및 전략을 맞춤설정해야 합니다.
  • 서비스 워커를 다른 플랫폼 기능 (예: 웹 푸시)과 함께 사용하려고 합니다.

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

    (문자열 | ManifestEntry)[] 선택사항

    빌드 구성의 일부로 생성된 항목 외에 사전 캐시될 항목 목록입니다.

  • dontCacheBustURLsMatching

    RegExp 선택사항

    이 애셋과 일치하는 애셋은 URL을 통해 고유하게 버전이 지정된 것으로 간주되며, 사전 캐시를 채울 때 수행되는 일반 HTTP 캐시 무효화에서 제외됩니다. 필수는 아니지만 기존 빌드 프로세스에서 이미 [hash] 값을 각 파일 이름에 삽입한 경우 이를 감지하는 RegExp를 제공하여 사전 캐싱할 때 소비되는 대역폭을 줄이는 것이 좋습니다.

  • 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"
> 및 객체 생략

속성

  • filePaths

    문자열[]

GeneratePartial

속성

  • babelPresetEnvTargets

    string[] 선택사항

    기본값은 ["chrome >= 56"]입니다.

    서비스 워커 번들을 트랜스파일할 때 babel-preset-env에 전달할 대상

  • cacheId

    문자열 선택사항

    캐시 이름 앞에 추가되는 선택적 ID입니다. 이는 주로 여러 사이트가 동일한 http://localhost:port 출처에서 제공될 수 있는 로컬 개발에 유용합니다.

  • cleanupOutdatedCaches

    부울 선택사항

    기본값은 false입니다.

    Workbox가 호환되지 않는 이전 버전에서 생성된 사전 캐시를 식별하고 삭제하려고 시도할지 여부를 나타냅니다.

  • clientsClaim

    부울 선택사항

    기본값은 false입니다.

    서비스 워커가 활성화되는 즉시 기존 클라이언트를 제어하기 시작해야 하는지 여부입니다.

  • directoryIndex

    문자열 선택사항

    /로 끝나는 URL의 탐색 요청이 사전 캐시된 URL과 일치하지 않으면 이 값이 URL에 추가되고 사전 캐시 일치 여부를 확인합니다. 이 이름은 웹 서버가 디렉터리 색인에 사용 중인 이름으로 설정해야 합니다.

  • disableDevLogs

    부울 선택사항

    기본값은 false입니다.

  • ignoreURLParametersMatching

    RegExp[] 선택사항

    이 배열의 RegExp 중 하나와 일치하는 모든 검색 매개변수 이름은 사전 캐시 일치를 찾기 전에 삭제됩니다. 이 기능은 사용자가 트래픽 소스를 추적하는 데 사용되는 URL 매개변수 등을 포함하는 URL을 요청할 수 있는 경우에 유용합니다. 제공하지 않은 경우 기본값은 [/^utm_/, /^fbclid$/]입니다.

  • importScripts

    string[] 선택사항

    생성된 서비스 워커 파일 내의 importScripts()에 전달해야 하는 JavaScript 파일 목록입니다. 이는 Workbox에서 최상위 서비스 워커 파일을 만들도록 하면서 푸시 이벤트 리스너와 같은 추가 코드를 포함하고자 할 때 유용합니다.

  • inlineWorkboxRuntime

    부울 선택사항

    기본값은 false입니다.

    Workbox 라이브러리의 런타임 코드를 최상위 서비스 워커에 포함해야 하는지, 아니면 서비스 워커와 함께 배포해야 하는 별도의 파일로 분할해야 하는지 여부입니다. 런타임을 별도로 유지하면 최상위 서비스 워커가 변경될 때마다 사용자가 Workbox 코드를 다시 다운로드할 필요가 없습니다.

  • 모드

    문자열 선택사항

    기본값: "production"

    'production'으로 설정하면 디버깅 정보를 제외하는 최적화된 서비스 워커 번들이 생성됩니다. 여기에서 명시적으로 구성하지 않은 경우 process.env.NODE_ENV 값이 사용되고, 실패하면 'production'로 대체됩니다.

  • navigateFallback

    문자열 선택사항

    기본값은 null입니다.

    지정하면 사전 캐시되지 않은 URL에 대한 모든 탐색 요청이 제공된 URL의 HTML로 처리됩니다. 사전 캐시 매니페스트에 나열된 HTML 문서의 URL을 전달해야 합니다. 이 방법은 모든 탐색에서 일반적인 앱 셸 HTML을 사용해야 하는 단일 페이지 앱 시나리오에서 사용하기 위한 것입니다.

  • navigateFallbackAllowlist

    RegExp[] 선택사항

    구성된 navigateFallback 동작이 적용되는 URL을 제한하는 정규 표현식의 배열(선택사항)입니다. 이는 사이트 URL의 하위 집합만 단일 페이지 앱의 일부로 취급해야 하는 경우에 유용합니다. navigateFallbackDenylist와 navigateFallbackAllowlist가 모두 구성된 경우 차단 목록이 우선합니다.

    참고: 이러한 정규식은 탐색 중에 모든 도착 URL에 대해 평가될 수 있습니다. 복잡한 RegExps를 사용하지 마세요. 사용하지 않으면 사용자가 사이트를 탐색할 때 지연이 발생할 수 있습니다.

  • navigateFallbackDenylist

    RegExp[] 선택사항

    구성된 navigateFallback 동작이 적용되는 URL을 제한하는 정규 표현식의 배열(선택사항)입니다. 이는 사이트 URL의 하위 집합만 단일 페이지 앱의 일부로 취급해야 하는 경우에 유용합니다. navigateFallbackDenylist와 navigateFallbackAllowlist가 모두 구성된 경우 차단 목록이 우선 적용됩니다.

    참고: 이러한 정규식은 탐색 중에 모든 도착 URL에 대해 평가될 수 있습니다. 복잡한 RegExps를 사용하지 마세요. 사용하지 않으면 사용자가 사이트를 탐색할 때 지연이 발생할 수 있습니다.

  • navigationPreload

    부울 선택사항

    기본값은 false입니다.

    생성된 서비스 워커에서 탐색 미리 로드를 사용 설정할지 여부입니다. true로 설정하면 runtimeCaching를 사용하여 탐색 요청과 일치하는 적절한 응답 전략을 설정하고 미리 로드된 응답을 활용해야 합니다.

  • offlineGoogleAnalytics

    boolean | GoogleAnalyticsInitializeOptions 선택사항

    기본값은 false입니다.

    오프라인 Google 애널리틱스에 대한 지원을 포함할지 여부를 제어합니다. true이면 workbox-google-analytics의 initialize() 호출이 생성된 서비스 워커에 추가됩니다. Object로 설정하면 객체가 initialize() 호출에 전달되므로 동작을 맞춤설정할 수 있습니다.

  • runtimeCaching

    RuntimeCaching[] 선택사항

    Workbox의 빌드 도구를 사용하여 서비스 워커를 생성할 때 런타임 캐싱 구성을 하나 이상 지정할 수 있습니다. 그런 다음 정의된 일치 및 핸들러 구성을 사용하여 workbox-routing.registerRoute 호출로 변환됩니다.

    모든 옵션은 workbox-build.RuntimeCaching 문서를 참고하세요. 아래 예는 두 개의 런타임 경로가 정의된 일반적인 구성을 보여줍니다.

  • skipWaiting

    부울 선택사항

    기본값은 false입니다.

    생성된 서비스 워커에 비조건부 skipWaiting() 호출을 추가할지 여부. false인 경우 message 리스너가 대신 추가되어 클라이언트 페이지가 대기 중인 서비스 워커에서 postMessage({type: 'SKIP_WAITING'})를 호출하여 skipWaiting()를 트리거할 수 있습니다.

  • 소스맵

    부울 선택사항

    기본값은 true입니다.

    생성된 서비스 워커 파일의 소스맵을 생성할지 여부입니다.

GenerateSWOptions

유형

BasePartial 및 GlobPartial 및 GeneratePartial 및 RequiredSWDestPartial 및 OptionalGlobDirectoryPartial

GetManifestOptions

유형

BasePartial 및 GlobPartial 및 RequiredGlobDirectoryPartial

GetManifestResult

속성

  • 수

    숫자

  • manifestEntries

    ManifestEntry[]

  • 크기

    숫자

  • 경고

    문자열[]

GlobPartial

속성

  • globFollow

    부울 선택사항

    기본값은 true입니다.

    사전 캐시 매니페스트를 생성할 때 심볼릭 링크를 따를지 결정합니다. 자세한 내용은 glob 문서에서 follow의 정의를 참고하세요.

  • globIgnores

    string[] 선택사항

    기본값은 ["**\/node_modules\/**\/*"]입니다.

    사전 캐시 매니페스트를 생성할 때 항상 제외할 파일과 일치하는 패턴의 집합입니다. 자세한 내용은 glob 문서에서 ignore의 정의를 참고하세요.

  • globPatterns

    string[] 선택사항

    기본값은 ["**\/*.{js,wasm,css,html}"]입니다.

    이러한 패턴과 일치하는 파일은 사전 캐시 매니페스트에 포함됩니다. 자세한 내용은 glob 기본 지침서를 참고하세요.

  • globStrict

    부울 선택사항

    기본값은 true입니다.

    true인 경우 사전 캐시 매니페스트를 생성할 때 디렉터리를 읽는 오류로 인해 빌드가 실패합니다. false이면 문제가 있는 디렉터리를 건너뜁니다. 자세한 내용은 glob 문서에서 strict의 정의를 참고하세요.

  • 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,
)

유형

기능

매개변수

  • manifestEntries

    (ManifestEntry 및 개체)[]

    • 크기

      숫자

  • 컴파일

    알 수 없음 선택사항

반환 값

ManifestTransformResult

속성

  • 매니페스트

    (ManifestEntry 및 개체)[]

    • 크기

      숫자

  • 경고

    string[] 선택사항

OptionalGlobDirectoryPartial

속성

  • globDirectory

    문자열 선택사항

    globPatterns와 일치시킬 로컬 디렉터리입니다. 경로는 현재 디렉터리를 기준으로 합니다.

RequiredGlobDirectoryPartial

속성

  • globDirectory

    문자열

    globPatterns와 일치시킬 로컬 디렉터리입니다. 경로는 현재 디렉터리를 기준으로 합니다.

RequiredSWDestPartial

속성

  • swDest

    문자열

    현재 작업 디렉터리를 기준으로, 빌드 프로세스에서 생성될 서비스 워커 파일의 경로 및 파일 이름입니다. '.js'로 끝나야 합니다.

RuntimeCaching

속성

StrategyName

enum

WebpackGenerateSWOptions

유형

BasePartial 및 WebpackPartial 및 GeneratePartial 및 WebpackGenerateSWPartial

WebpackGenerateSWPartial

속성

  • importScriptsViaChunks

    string[] 선택사항

    하나 이상의 웹팩 청크 이름입니다. 이러한 청크의 콘텐츠는 importScripts() 호출을 통해 생성된 서비스 워커에 포함됩니다.

  • swDest

    문자열 선택사항

    기본값은 "service-worker.js"입니다.

    이 플러그인이 생성한 서비스 워커 파일의 애셋 이름입니다.

WebpackInjectManifestOptions

유형

BasePartial 및 WebpackPartial 및 InjectPartial 및 WebpackInjectManifestPartial

WebpackInjectManifestPartial

속성

  • compileSrc

    부울 선택사항

    기본값은 true입니다.

    true (기본값)이면 swSrc 파일이 webpack으로 컴파일됩니다. false인 경우 컴파일이 실행되지 않으며 webpackCompilationPlugins를 사용할 수 없습니다. 매니페스트를 JSON 파일과 같은 위치에 삽입하려면 false로 설정합니다.

  • swDest

    문자열 선택사항

    이 플러그인에서 생성될 서비스 워커 파일의 애셋 이름입니다. 생략할 경우 swSrc 이름을 기반으로 이름이 지정됩니다.

  • webpackCompilationPlugins

    any[] 선택사항

    swSrc 입력 파일을 컴파일할 때 사용할 선택적 webpack 플러그인입니다. compileSrc가 true인 경우에만 유효합니다.

WebpackPartial

속성

  • 청크

    string[] 선택사항

    해당 출력 파일이 사전 캐시 매니페스트에 포함되어야 하는 하나 이상의 청크 이름입니다.

  • 제외

    (문자열 | RegExp | function)[] 선택사항

    사전 캐시 매니페스트에서 애셋을 제외하는 데 사용되는 하나 이상의 지정자입니다. 이는 webpack의 표준 exclude 옵션과 동일한 규칙에 따라 해석됩니다. 제공하지 않은 경우 기본값은 [/\.map$/, /^manifest.*\.js$]입니다.

  • excludeChunks

    string[] 선택사항

    해당 출력 파일을 사전 캐시 매니페스트에서 제외해야 하는 하나 이상의 청크 이름입니다.

  • include

    (문자열 | RegExp | function)[] 선택사항

    사전 캐시 매니페스트에 애셋을 포함하는 데 사용되는 하나 이상의 지정자입니다. 이는 webpack의 표준 include 옵션과 동일한 규칙에 따라 해석됩니다.

  • 모드

    문자열 선택사항

    'production'으로 설정하면 디버깅 정보를 제외하는 최적화된 서비스 워커 번들이 생성됩니다. 여기에서 명시적으로 구성하지 않은 경우 현재 webpack 컴파일에 구성된 mode 값이 사용됩니다.

메서드

copyWorkboxLibraries()

workbox-build.copyWorkboxLibraries(
  destDirectory: string,
)

그러면 Workbox에서 사용하는 런타임 라이브러리 집합을 로컬 디렉터리에 복사해 서비스 워커 파일과 함께 배포해야 합니다.

이러한 로컬 사본을 배포하는 대신 공식 CDN URL의 Workbox를 사용할 수 있습니다.

이 메서드는 workbox-build.injectManifest를 사용하는 개발자 중 Workbox의 CDN 사본을 사용하지 않으려는 개발자에게 유용할 수 있습니다. workbox-build.generateSW를 사용하는 개발자는 이 메서드를 명시적으로 호출할 필요가 없습니다.

매개변수

  • destDirectory

    문자열

    라이브러리의 새 디렉터리가 만들어질 상위 디렉터리의 경로입니다.

반환 값

  • 프로미스<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: '...',
});

매개변수

반환 값