rishabh3112 / gridsome-plugin-pwa

PWA plugin for gridsome
MIT License
30 stars 18 forks source link

Serve manifest.json in development mode #21

Open cco3 opened 4 years ago

cco3 commented 4 years ago

It'd be nice if this plugin automatically configured the express server to serve up the manifest.json file

rishabh3112 commented 4 years ago

@cco3 feel free to send a PR 👍, Thanks!

AllanChain commented 4 years ago

I am trying to work on it, but this requires a lot of change. My solution is to write a simple webpack plugin (inspired by vue-cli) and add manifest.json and icons as assets. Currently testing it.

A few behaviors will change:

Is there a better solution?

rishabh3112 commented 4 years ago

@AllanChain Thanks for putting efforts into this 😀. I think we can configure express instance of gridsome's development server. Look for configureServer hook in it's server API. We can configure /manifest.json to serve manifest.

AllanChain commented 4 years ago

@rishabh3112 Serving manifest.json is simple. The problem is the icons. (browser will follow manifest and request icons.)

It's still difficult to configure dev server under assets/static/ because of its special meaning.

Also, generating on plugin init and serving from memory / temp dir, does not sound so good.

rishabh3112 commented 4 years ago

@AllanChain why not create icons themselves while serving on the route /manifest.json?, this way we would be generating icons after Gridsome overrides the folder.

Idea for watching icon for changes/regenerating (by configuring devServer in webpack config) justn't look good to me as sharp how ever fast, it would slow down the dev time be approx ~1s in case of a change, plus other caveats you mentioned as well.

AllanChain commented 4 years ago

Emm, webpack dev server is serving from memory.. Means there is no actual assets/static dir to write. But it's possible to setup temp dir or force dev server write to disk to achieve this

Serving on manifest.json may still lead to icon not found error because browser request might be faster. (Although on my computer, icons are generated in 0.2s)

The path of icons still need to change if you don't want to use ugly /assets/static/${filename}.*?${fileExtension}-like way to config dev server.

And indeed, let dev server to handle this is a good way to solve the first con listed below.


Listing / updating pros and cons of adding as webpack assets: