GoogleChrome / workbox

πŸ“¦ Workbox: JavaScript libraries for Progressive Web Apps
https://developers.google.com/web/tools/workbox/
MIT License
12.35k stars 816 forks source link

workbox-webpack-plugin InjectManifest missing a lot of files #3270

Closed albgen closed 6 months ago

albgen commented 1 year ago

I'm using workbox-webpack-plugin's InjectManifest to generate the __WB_MANIFEST list, for precacheAndRoute in the service-worker.js. The problem is that __WB_MANIFEST list does not include images, fonts, css or others resources.

Using CRA without eject.

Really can't understand if it is a bug or misconfig.

service-worker.js

/* eslint-disable no-restricted-globals */

import { clientsClaim} from 'workbox-core';
import {precacheAndRoute} from 'workbox-precaching';

// import { ExpirationPlugin } from 'workbox-expiration';
// import { registerRoute } from 'workbox-routing';
// import { StaleWhileRevalidate } from 'workbox-strategies';

// Precache all of the assets generated by your build process.
// Their URLs are injected into the manifest variable below.
// This variable must be present somewhere in your service worker file,
// even if you decide not to use precaching. See https://cra.link/PWA
precacheAndRoute(self.__WB_MANIFEST);

// setLogLevel(workbox.core.LOG_LEVELS.debug);

// Main
clientsClaim();

// Install directly new version, don't wait to stop!
// The skipWaiting wrapper is deprecated https://developer.chrome.com/docs/workbox/modules/workbox-core/
self.skipWaiting();

self.addEventListener('fetch', (event) => {
    // Add any custom caching rules here
});

This is how i register the service worker

import {Workbox} from 'workbox-window';

export default function registerSW() {  

  if ('serviceWorker' in navigator) {
    const wb = new Workbox('sw.js');

    wb.addEventListener('installed', (event) => {
      if (event.isUpdate){
        if (confirm('Update available, Click Ok to refresh!'))
         window.location.reload();
      }

    });

    wb.register().then((registration) => {
      console.log('Service Worker registered: ', registration);
    })
    .catch((error) => {
      console.log('Service Worker registration failed: ', error);
    });

  }
}

config-overrides.js

const { defaultInjectConfig, InjectManifest } = require('workbox-webpack-plugin');
const webpack = require('webpack');
const path = require('path');
const {rewireWorkboxInject} = require('react-app-rewire-workbox');

module.exports = function override(config, env) {
  const workboxConfig = {
    ...defaultInjectConfig,
    swSrc: path.join(__dirname, 'src', 'service-worker.js'),
    swDest: 'sw.js',
    exclude: [/.*\.txt/,'service-worker.js',/\.map$/, /^manifest.*\.js(?:on)?$/]
  };
  config.plugins.push(new InjectManifest(workboxConfig));

  config.resolve.fallback = {
    process: require.resolve('process/browser'),
    zlib: require.resolve('browserify-zlib'),
    stream: require.resolve('stream-browserify'),
    util: require.resolve('util'),
    buffer: require.resolve('buffer'),
    asset: require.resolve('assert'),
  };

  config.plugins.push(
    new webpack.ProvidePlugin({
      process: 'process/browser.js',
      Buffer: ['buffer', 'Buffer'],
    })
  );  

  return config;
};

The following are the urls generated on sw.js

{ revision: 'dfb30077622a99f76a2923a84cace995', url: '/index.html' }, { revision: null, url: '/static/css/9851.21ee7f76.chunk.css' }, { revision: null, url: '/static/css/main.69ae699e.css' }, { revision: null, url: '/static/js/1066.ea61f9fc.chunk.js' }, { revision: null, url: '/static/js/1107.bb0476b0.chunk.js' }, { revision: null, url: '/static/js/1225.67033754.chunk.js' }, { revision: null, url: '/static/js/1347.d139ab9d.chunk.js' }, { revision: null, url: '/static/js/1406.3cbb2f40.chunk.js' }, { revision: null, url: '/static/js/1626.14530edd.chunk.js' }, { revision: null, url: '/static/js/1897.d5c33a0e.chunk.js' }, { revision: null, url: '/static/js/2104.1d388dfb.chunk.js' }, { revision: null, url: '/static/js/2247.35a130d3.chunk.js' }, { revision: null, url: '/static/js/2323.d51f107f.chunk.js' }, { revision: null, url: '/static/js/2569.4243e22c.chunk.js' }, { revision: null, url: '/static/js/2619.68d84ac6.chunk.js' }, { revision: null, url: '/static/js/2724.860ea74f.chunk.js' }, { revision: null, url: '/static/js/2778.4f620227.chunk.js' }, { revision: null, url: '/static/js/2793.0ec32099.chunk.js' }, { revision: null, url: '/static/js/2878.b74f4a28.chunk.js' }, { revision: null, url: '/static/js/2997.5dbc149b.chunk.js' }, { revision: null, url: '/static/js/3120.3c19a87b.chunk.js' }, { revision: null, url: '/static/js/3401.03123535.chunk.js' }, { revision: null, url: '/static/js/3489.f5616155.chunk.js' }, { revision: null, url: '/static/js/3543.a86fdcc0.chunk.js' }, { revision: null, url: '/static/js/3558.828681a1.chunk.js' }, { revision: null, url: '/static/js/3639.9cf15346.chunk.js' }, { revision: null, url: '/static/js/3695.4521d1ea.chunk.js' }, { revision: null, url: '/static/js/3705.3b8c7c9a.chunk.js' }, { revision: null, url: '/static/js/3742.f44dcf90.chunk.js' }, { revision: null, url: '/static/js/3764.cb678089.chunk.js' }, { revision: null, url: '/static/js/3963.51fefafe.chunk.js' }, { revision: null, url: '/static/js/4017.37bb3569.chunk.js' }, { revision: null, url: '/static/js/4245.a61fbefc.chunk.js' }, { revision: null, url: '/static/js/4294.2916e314.chunk.js' }, { revision: null, url: '/static/js/4559.e1541e1f.chunk.js' }, { revision: null, url: '/static/js/4832.a884a4d4.chunk.js' }, { revision: null, url: '/static/js/5560.e10ef843.chunk.js' }, { revision: null, url: '/static/js/560.7cc98310.chunk.js' }, { revision: null, url: '/static/js/5644.a568c21d.chunk.js' }, { revision: null, url: '/static/js/5726.0ec1f60a.chunk.js' }, { revision: null, url: '/static/js/5825.b2208250.chunk.js' }, { revision: null, url: '/static/js/6101.eed8d228.chunk.js' }, { revision: null, url: '/static/js/6182.2ad5347d.chunk.js' }, { revision: null, url: '/static/js/6250.2e0e44fa.chunk.js' }, { revision: null, url: '/static/js/6263.52aeec26.chunk.js' }, { revision: null, url: '/static/js/6323.0b813fd1.chunk.js' }, { revision: null, url: '/static/js/6370.4a6e82f7.chunk.js' }, { revision: null, url: '/static/js/6390.5e00c29f.chunk.js' }, { revision: null, url: '/static/js/6648.ff20a1c5.chunk.js' }, { revision: null, url: '/static/js/6870.0cc8b6d8.chunk.js' }, { revision: null, url: '/static/js/7081.f2eff227.chunk.js' }, { revision: null, url: '/static/js/7403.12168d36.chunk.js' }, { revision: null, url: '/static/js/7434.5a15258c.chunk.js' }, { revision: null, url: '/static/js/7774.b3e90fd8.chunk.js' }, { revision: null, url: '/static/js/7797.83a9038e.chunk.js' }, { revision: null, url: '/static/js/7995.04782ce0.chunk.js' }, { revision: null, url: '/static/js/8042.229a37e5.chunk.js' }, { revision: null, url: '/static/js/8054.abac2daf.chunk.js' }, { revision: null, url: '/static/js/8301.38abc96c.chunk.js' }, { revision: null, url: '/static/js/8495.29f0b04e.chunk.js' }, { revision: null, url: '/static/js/8555.03ad1b59.chunk.js' }, { revision: null, url: '/static/js/8755.e3b0b97e.chunk.js' }, { revision: null, url: '/static/js/8829.30a5d5d4.chunk.js' }, { revision: null, url: '/static/js/8880.db9273a5.chunk.js' }, { revision: null, url: '/static/js/8969.359724bf.chunk.js' }, { revision: null, url: '/static/js/8977.044a87a4.chunk.js' }, { revision: null, url: '/static/js/916.b6edcf21.chunk.js' }, { revision: null, url: '/static/js/9182.9876e9c7.chunk.js' }, { revision: null, url: '/static/js/9487.86d868e8.chunk.js' }, { revision: null, url: '/static/js/9522.bd1fb3d7.chunk.js' }, { revision: null, url: '/static/js/9834.1a1374a3.chunk.js' }, { revision: null, url: '/static/js/9851.6a838cfd.chunk.js' }, { revision: null, url: '/static/js/main.f290494d.js' }, { revision: null, url: '/static/media/axios.b2798fd764a875f97f44.cjs' },

The following is the actual build folder content:

D:\GITREPOS\TBTECH.AMG.FRONTEND\BUILD
β”‚   asset-manifest.json
β”‚   index.html
β”‚   manifest.json
β”‚   robots.txt
β”‚   service-worker.js
β”‚   service-worker.js.LICENSE.txt
β”‚   sw.js
β”‚   sw.js.LICENSE.txt
β”‚   _redirects
β”‚
β”œβ”€β”€β”€favicon
β”‚       android-chrome-192x192.png
β”‚       android-chrome-512x512.png
β”‚       apple-touch-icon.png
β”‚       favicon-16x16.png
β”‚       favicon-32x32.png
β”‚       favicon.ico
β”‚
β”œβ”€β”€β”€fonts
β”‚       CircularStd-Bold.otf
β”‚       CircularStd-Book.otf
β”‚       CircularStd-Medium.otf
β”‚       index.css
β”‚       Roboto-Bold.ttf
β”‚       Roboto-Regular.ttf
β”‚
β”œβ”€β”€β”€icons
β”‚       ic_analytics.svg
β”‚       ic_asset.svg
β”‚       ic_banking.svg
β”‚       ic_blog.svg
β”‚       ic_booking.svg
β”‚       ic_calendar.svg
β”‚       ic_cart.svg
β”‚       ic_chat.svg
β”‚       ic_dashboard.svg
β”‚       ic_ecommerce.svg
β”‚       ic_invoice.svg
β”‚       ic_kanban.svg
β”‚       ic_mail.svg
β”‚       ic_return.svg
β”‚       ic_sales.svg
β”‚       ic_transfer.svg
β”‚       ic_user.svg
β”‚       ic_warehouse.svg
β”‚
β”œβ”€β”€β”€images
β”‚       illustration_empty_content.png
β”‚       img_placeholder.svg
β”‚       logo.png
β”‚
β”œβ”€β”€β”€logo
β”‚       logo_full.jpg
β”‚       logo_full.svg
β”‚       logo_single.svg
β”‚
└───static
    β”œβ”€β”€β”€css
    β”‚       9851.21ee7f76.chunk.css
    β”‚       main.69ae699e.css
    β”‚
    β”œβ”€β”€β”€js
    β”‚       1066.ea61f9fc.chunk.js
    β”‚       1107.bb0476b0.chunk.js
    β”‚       1225.67033754.chunk.js
    β”‚       1347.d139ab9d.chunk.js
    β”‚       1406.3cbb2f40.chunk.js
    β”‚       1626.14530edd.chunk.js
    β”‚       1897.d5c33a0e.chunk.js
    β”‚       2104.1d388dfb.chunk.js
    β”‚       2247.35a130d3.chunk.js
    β”‚       2247.35a130d3.chunk.js.LICENSE.txt
    β”‚       2323.d51f107f.chunk.js
    β”‚       2569.4243e22c.chunk.js
    β”‚       2619.68d84ac6.chunk.js
    β”‚       2724.860ea74f.chunk.js
    β”‚       2778.4f620227.chunk.js
    β”‚       2793.0ec32099.chunk.js
    β”‚       2878.b74f4a28.chunk.js
    β”‚       2997.5dbc149b.chunk.js
    β”‚       3120.3c19a87b.chunk.js
    β”‚       3401.03123535.chunk.js
    β”‚       3489.f5616155.chunk.js
    β”‚       3543.a86fdcc0.chunk.js
    β”‚       3558.828681a1.chunk.js
    β”‚       3639.9cf15346.chunk.js
    β”‚       3695.4521d1ea.chunk.js
    β”‚       3705.3b8c7c9a.chunk.js
    β”‚       3742.f44dcf90.chunk.js
    β”‚       3764.cb678089.chunk.js
    β”‚       3963.51fefafe.chunk.js
    β”‚       4017.37bb3569.chunk.js
    β”‚       4245.a61fbefc.chunk.js
    β”‚       4294.2916e314.chunk.js
    β”‚       4559.e1541e1f.chunk.js
    β”‚       4832.a884a4d4.chunk.js
    β”‚       5560.e10ef843.chunk.js
    β”‚       560.7cc98310.chunk.js
    β”‚       5644.a568c21d.chunk.js
    β”‚       5726.0ec1f60a.chunk.js
    β”‚       5726.0ec1f60a.chunk.js.LICENSE.txt
    β”‚       5825.b2208250.chunk.js
    β”‚       6101.eed8d228.chunk.js
    β”‚       6182.2ad5347d.chunk.js
    β”‚       6250.2e0e44fa.chunk.js
    β”‚       6263.52aeec26.chunk.js
    β”‚       6323.0b813fd1.chunk.js
    β”‚       6370.4a6e82f7.chunk.js
    β”‚       6390.5e00c29f.chunk.js
    β”‚       6648.ff20a1c5.chunk.js
    β”‚       6870.0cc8b6d8.chunk.js
    β”‚       7081.f2eff227.chunk.js
    β”‚       7403.12168d36.chunk.js
    β”‚       7434.5a15258c.chunk.js
    β”‚       7774.b3e90fd8.chunk.js
    β”‚       7797.83a9038e.chunk.js
    β”‚       7995.04782ce0.chunk.js
    β”‚       8042.229a37e5.chunk.js
    β”‚       8054.abac2daf.chunk.js
    β”‚       8301.38abc96c.chunk.js
    β”‚       8495.29f0b04e.chunk.js
    β”‚       8555.03ad1b59.chunk.js
    β”‚       8755.e3b0b97e.chunk.js
    β”‚       8829.30a5d5d4.chunk.js
    β”‚       8829.30a5d5d4.chunk.js.LICENSE.txt
    β”‚       8880.db9273a5.chunk.js
    β”‚       8969.359724bf.chunk.js
    β”‚       8977.044a87a4.chunk.js
    β”‚       916.b6edcf21.chunk.js
    β”‚       9182.9876e9c7.chunk.js
    β”‚       9487.86d868e8.chunk.js
    β”‚       9522.bd1fb3d7.chunk.js
    β”‚       9834.1a1374a3.chunk.js
    β”‚       9851.6a838cfd.chunk.js
    β”‚       9851.6a838cfd.chunk.js.LICENSE.txt
    β”‚       main.f290494d.js
    β”‚       main.f290494d.js.LICENSE.txt
    β”‚
    └───media
            axios.b2798fd764a875f97f44.cjs

Library Affected: "workbox-core": "^7.0.0", "workbox-expiration": "^7.0.0", "workbox-precaching": "^7.0.0", "workbox-routing": "^7.0.0", "workbox-strategies": "^7.0.0", "workbox-webpack-plugin": "^7.0.0", "workbox-window": "^7.0.0"

Browser & Platform: Google Chrome v119.0.6045.106 for windows. Did not tested on other browsers

tomayac commented 6 months ago

Hi there,

Workbox is moving to a new engineering team within Google. As part of this move, we're declaring a partial bug bankruptcy to allow the new team to start fresh. We realize this isn't optimal, but realistically, this is the only way we see it working. For transparency, here're the criteria we applied:

Thanks, and we hope for your understanding! The Workbox team