diff --git a/types/workbox-webpack-plugin/index.d.ts b/types/workbox-webpack-plugin/index.d.ts index 3d433a501b..111d27f563 100644 --- a/types/workbox-webpack-plugin/index.d.ts +++ b/types/workbox-webpack-plugin/index.d.ts @@ -1,6 +1,7 @@ -// Type definitions for workbox-webpack-plugin 5.0 +// Type definitions for workbox-webpack-plugin 5.1 // Project: https://github.com/GoogleChrome/workbox/blob/master/packages/workbox-webpack-plugin, https://github.com/googlechrome/workbox // Definitions by: Kevin Groat +// Piotr Błażejewicz // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped export type ChacheStrategy = 'CacheFirst' | 'CacheOnly' | 'NetworkFirst' | 'NetworkOnly' | 'StaleWhileRevalidate'; @@ -101,6 +102,18 @@ export interface RuntimeCacheRule { } export interface CommonOptions { + /** + * A list of entries to be precached, in addition to any entries that are generated as part of the build configuration. + */ + additionalManifestEntries?: Array<{ + /** The URL to the asset in the manifest. */ + url: string; + /** The revision details for the file. This is a hash generated by node based on the file contents. */ + revision?: string; + /** Integrity metadata that will be used when making the network request for the URL. */ + integrity?: string; + } | string>; + /** * The path and filename of the service worker file that will be created by the build process, relative to the webpack output directory. * @@ -142,6 +155,13 @@ export interface CommonOptions { * @alias test */ include?: Array; + + /** + * One or more names of webpack chunks. + * The content of those chunks will be included in the generated service worker, via a call to importScripts() + */ + importScriptsViaChunks?: string[]; + test?: Array; /** @@ -167,6 +187,12 @@ export interface CommonOptions { */ importsDirectory?: string; + /** + * If set to 'production', then an optimized service worker bundle that excludes debugging info will be produced. + * If not explicitly configured here, the mode value configured in the current webpack compilation will be used + */ + mode?: 'production' | string; + /** * Workbox automatically creates a JavaScript file that contains information about URLs that need to be precached. By default, this file is called `precache-manifest.[manifestHash].js`, * where `[manifestHash]` is automatically replaced by a unique value that identifies the contents of the file. @@ -287,6 +313,23 @@ export interface CommonOptions { } export interface GenerateSWOptions extends CommonOptions { + /** + * The targets to pass to babel-preset-env when transpiling the service worker bundle + */ + babelPresetEnvTargets?: string[]; + + /** + * Whether or not Workbox should attempt to identify an delete any precaches created by older, incompatible versions + */ + cleanupOutdatedCaches?: boolean; + + /** + * Whether the runtime code for the Workbox library should be included in the top-level service worker, + * or split into a separate file that needs to be deployed alongside the service worker. Keeping the runtime separate means + * that users will not have to re-download the Workbox code each time your top-level service worker changes + */ + inlineWorkboxRuntime?: boolean; + /** * Whether or not the service worker should skip over the waiting lifecycle stage. Normally this is used with `clientsClaim: true`. * @@ -295,6 +338,11 @@ export interface GenerateSWOptions extends CommonOptions { */ skipWaiting?: boolean; + /** + * Whether to create a sourcemap for the generated service worker files + */ + sourcemap?: boolean; + /** * Whether or not the service worker should [start controlling](https://developers.google.com/web/fundamentals/primers/service-workers/lifecycle#clientsclaim) * any existing clients as soon as it activates. @@ -351,6 +399,12 @@ export interface GenerateSWOptions extends CommonOptions { */ navigateFallbackAllowlist?: RegExp[]; + /** + * Whether or not to enable navigation preload in the generated service worker. + * When set to true, you must also use runtimeCaching to set up an appropriate response strategy that will match navigation requests, and make use of the preloaded response + */ + navigationPreload?: boolean; + /** * An required list of JavaScript files that should be passed to * [`importScripts()`](https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/importScripts) inside the generated service worker file. @@ -420,6 +474,19 @@ export interface InjectManifestOptions extends CommonOptions { * @example swSrc: path.join('src', 'sw.js') */ swSrc: string; + + /** + * When true (the default), the swSrc file will be compiled by webpack. + * When false, compilation will not occur (and webpackCompilationPlugins can't be used.) + * Set to false if you want to inject the manifest into, e.g., a JSON file + * @default true + */ + compileSrc?: boolean; + + /** + * Optional webpack plugins that will be used when compiling the swSrc input file + */ + webpackCompilationPlugins?: any[]; } /** diff --git a/types/workbox-webpack-plugin/workbox-webpack-plugin-tests.ts b/types/workbox-webpack-plugin/workbox-webpack-plugin-tests.ts index fd0f29fd70..19269f8844 100644 --- a/types/workbox-webpack-plugin/workbox-webpack-plugin-tests.ts +++ b/types/workbox-webpack-plugin/workbox-webpack-plugin-tests.ts @@ -1,4 +1,5 @@ import { GenerateSW, InjectManifest } from 'workbox-webpack-plugin'; +import webpack = require('webpack'); // GenerateSW { @@ -12,20 +13,28 @@ import { GenerateSW, InjectManifest } from 'workbox-webpack-plugin'; // With all of the examples plugin = new GenerateSW({ + additionalManifestEntries: [ + 'https://example.org/api', + ], + babelPresetEnvTargets: ['target1', 'target2'], swDest: 'custom-sw-name.js', + cleanupOutdatedCaches: true, // *Only* include assets that belong to these chunks: chunks: ['chunk-name-1', 'chunk-name-2'], // Exclude assets that belong to these chunks: excludeChunks: ['chunk-name-1', 'chunk-name-2'], + importScriptsViaChunks: ['sw'], // Only include HTML and JS assets when precaching: include: [/\.html$/, /\.js$/], // Exclude JPG and PNG assets from precaching: exclude: [/\.jpg$/, /\.png$/], + inlineWorkboxRuntime: true, // Use a 'wb-assets' directory for Workbox's assets, // under the top-level output directory. importsDirectory: 'wb-assets', precacheManifestFilename: 'wb-manifest.[manifestHash].js', skipWaiting: true, + sourcemap: true, clientsClaim: true, runtimeCaching: [{ // Match any same-origin request that contains 'api'. @@ -86,6 +95,7 @@ import { GenerateSW, InjectManifest } from 'workbox-webpack-plugin'; navigateFallbackDenylist: [/^\/_/, /admin/], // Include URLs that start with /pages: navigateFallbackAllowlist: [/^\/pages/], + navigationPreload: true, importScripts: ['push-notifications.abcd1234.js'], // This will ignore all parameters: ignoreUrlParametersMatching: [/./], @@ -108,6 +118,7 @@ import { GenerateSW, InjectManifest } from 'workbox-webpack-plugin'; // Increase the limit to 4mb: maximumFileSizeToCacheInBytes: 4 * 1024 * 1024, dontCacheBustUrlsMatching: /\.\w{8}\./, + mode: 'production', modifyUrlPrefix: { // Remove a '/dist' prefix from the URLs: '/dist': '' @@ -139,11 +150,16 @@ import { GenerateSW, InjectManifest } from 'workbox-webpack-plugin'; // With all of the examples plugin = new InjectManifest({ + additionalManifestEntries: [ + 'https://example.org/api', + ], swDest: 'custom-sw-name.js', // *Only* include assets that belong to these chunks: chunks: ['chunk-name-1', 'chunk-name-2'], + compileSrc: true, // Exclude assets that belong to these chunks: excludeChunks: ['chunk-name-1', 'chunk-name-2'], + importScriptsViaChunks: ['sw'], // Only include HTML and JS assets when precaching: include: [/\.html$/, /\.js$/], // Exclude JPG and PNG assets from precaching: @@ -169,6 +185,7 @@ import { GenerateSW, InjectManifest } from 'workbox-webpack-plugin'; // Increase the limit to 4mb: maximumFileSizeToCacheInBytes: 4 * 1024 * 1024, dontCacheBustUrlsMatching: /\.\w{8}\./, + mode: 'production', modifyUrlPrefix: { // Remove a '/dist' prefix from the URLs: '/dist': '' @@ -182,6 +199,11 @@ import { GenerateSW, InjectManifest } from 'workbox-webpack-plugin'; const warnings = ['warning']; return {manifest, warnings}; } + ], + webpackCompilationPlugins: [ + new webpack.DefinePlugin({ + REVISION__: JSON.stringify(process.env.COMMIT_SHA1) + }) ] }); }