facebook/create-react-app

Support for a workbox.config.js override file

jeffposnick opened this issue ยท 16 comments

As per #5111 (comment), there was discussion around the c-r-a v2 timeframe for allowing developers to override the default workbox-webpack-plugin (i.e. service worker generation) configuration with their own external workbox.config.js file. This functionality did not end up making it into the final release, though.

I'd love to see that happen, as putting together a one-size-fits-all default config can leave some developers confused.

I'm happy to submit a PR for that and update the docs accordingly, but I wanted to see if there was any prior art around external, user-controllable configuration files that did make it into the c-r-a v2 release. I'd rather just use a similar approach for Workbox if that solution for another plugin already exists.

If there is no prior art for configuring other plugins in v2, I'd like to confirm that folks like @gaearon and @Timer are fully on board with the idea of external config files, since it's been a contentious point in the past.

Timer commented

There's no prior art, but I'd love to see a solution that scales. We're on board with this configuration but would like to discuss its ergonomics first.

Are you set using a new external config file? Would you consider extending package.json. e.g.

{
  "name": "app",
  "version": "0.0.0",
  "react-scripts": {
    "workbox-webpack-plugin": {
      "skipWaiting": true
    }
  }
}
Timer commented

I think we'd rather use a file. e.g.

// react-app.config.js
module.exports = {
  workbox(options) {
    // should options be frozen?
    return options
  }
};

Would this simplify the process to add features like push eventlistener and cross origin images etc?

I'd be thrilled

@jeffposnick, @Timer I would be happy to contribute on this issue if it is open to contributors.

Would you prefer to have a workbox.config.js file catering for only overrides to the workbox-webpack-plugin or a react-app.config.js with an option for workbox-webpack-plugin configuration?

I'm in favor of adding a cra.config.js for these config and others, overriding default ones!

Since there's interest from the community, I'm very happy to let others implement the actual code for this feature, and I could contribute relevant documentation once that's in place.

We need to configure CRA to build service-worker.js and precache-manifest.xxxxx.js inside build/static/js folder, and not directly inside build folder root as it is now.
This would result in almost not having to change our production nginx configuration.
So I guess the ability to have a cra.config.js file to owerride some Workbox options would do the trick.

If it's in v3 milestone., it would be super nice to upgrade to workbox 4.1+.

It fixes few edge cases, esapecially for precaching on Firefox (see GoogleChrome/workbox#1783 and few others). V4 was redesigned with that in mind.

@iansu I can see this is now in progress, could you please clarify what is the planned direction you guys are going: react-app.config.js as mentioned by @Timer or workbox.config.js as detailed by @jeffposnick ?

Thanks

iansu commented

#5369 adds a workbox.config.js file.

Maybe a little late to the party but how does this (and the changes in the reference PR #5369) relate to other APIs that could be supported while using workbox but are not the suggested use-cases for the GenerateSW Plugin such as Web Push?

As I would like to support Web Push (and I could imagine that I am not the only one) in a few CRA projects of mine without ejecting I would be glad if that could also be supported maybe by allowing to switch to the InjectManifest Plugin instead of the GenerateSW one?

when will this be available for use?

is it ready

Any update here team ?