Vue-cli: File in root directory

[panayotoff]

Hi;

I'm new to Vue and I'm using it with vue-cli and webpack;
In the app I'm using I want to create and register service worker ( single sw.js file ) in the root directory of the project under development and also to copy it to the root dist folder ( the same level as index.html ) on building for production. I tried different webpack configs, but with no succes.
Any help will be appreciated.

I 'worked-around' it by editing /config/index.js file and setting the assetsSubDirectory path to empty string, so all my assets are served in the same directory as the index file, but is it possible to to it for single file?

Also I think a lot of other people will run the same issue when building progressive web apps, so it will be great if you also add the answer to the docs.

Best,
Chris

[joshwcomeau]

I encountered the same issue when trying to add a service worker to my Vue app. Would be great to see the recommended practice for handling this!

[LinusBorg]

You may consider using this:

https://github.com/oliviertassinari/serviceworker-webpack-plugin

[panayotoff]

Yes, this seems like a plugin that will do the job. For one project I used sw-pecache plugin, but I prefer to write my custom logic in the service worker.

[posva]

I really recommend the offline-plugin (https://github.com/NekR/offline-plugin)