inject-assets-webpack-plugin/README.md

inject-assets-webpack-plugin

A plugin for webpack 4 which replaces assets in other assets. It was created to be used for caching in service workers.

The plugin comes in handy when you add hashes to your assets during the webpack build.

It can also be used in watch mode.

installation

npm i -D @mightyplow/inject-assets-webpack-plugin

usage

The assets you want to be replaced have to be wrapped by double curly braces. The assets can only be replaced if the target is also a webpack asset.

So for example if you want to replace the assets in a service worker, it has either be built by webpack or at least run through another plugin. Personally I like to use the copy-webpack-plugin to copy the service worker to the target directory.

inside ServiceWorker

const FILES_TO_CACHE = [
    '/',
    '{{vendor}}',
    '{{app}}'
]

The asset names will be replaced by the output filesnames specified in the webpacks (or it's plugins) options.