{"id":26430381,"url":"https://github.com/lavas-project/jekyll-pwa","last_synced_at":"2025-04-09T07:06:52.390Z","repository":{"id":55392640,"uuid":"109855759","full_name":"lavas-project/jekyll-pwa","owner":"lavas-project","description":"Jekyll plugin for PWA","archived":false,"fork":false,"pushed_at":"2022-08-29T10:46:53.000Z","size":563,"stargazers_count":107,"open_issues_count":15,"forks_count":19,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-04-02T02:16:25.971Z","etag":null,"topics":["jekyll","jekyll-plugin","pwa","ruby","workbox"],"latest_commit_sha":null,"homepage":"","language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lavas-project.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-11-07T15:42:15.000Z","updated_at":"2024-07-28T15:11:06.000Z","dependencies_parsed_at":"2022-08-14T23:11:05.686Z","dependency_job_id":null,"html_url":"https://github.com/lavas-project/jekyll-pwa","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lavas-project%2Fjekyll-pwa","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lavas-project%2Fjekyll-pwa/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lavas-project%2Fjekyll-pwa/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lavas-project%2Fjekyll-pwa/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lavas-project","download_url":"https://codeload.github.com/lavas-project/jekyll-pwa/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247994121,"owners_count":21030050,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["jekyll","jekyll-plugin","pwa","ruby","workbox"],"created_at":"2025-03-18T05:19:52.297Z","updated_at":"2025-04-09T07:06:52.372Z","avatar_url":"https://github.com/lavas-project.png","language":"Ruby","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Jekyll PWA Plugin [![Gem Version](https://badge.fury.io/rb/jekyll-pwa-plugin.png)](http://badge.fury.io/rb/jekyll-pwa-plugin)\n\n\u003e PWA support for Jekyll\n\nThis plugin provides PWA support for Jekyll. Generate a service worker and provides precache and runtime cache with Google Workbox.\n\nGoogle Workbox has already developed a series of [tools](https://developers.google.com/web/tools/workbox/). If you use Webpack or Gulp as your build tool, you can easily generate a service worker with these tools. But in my blog, I don't want to use even npm, and I want to precache recent 10 posts so that they are offline available to visitors even though these posts were never opened by visitors before. That's why I try to integrate this function in Jekyll build process.\n\n**IMPORTANT** This plugin supports Workbox V5 since `v5.1.4`.\nThe API of Workbox V5 has changed a lot compared to previous versions, some more powerful functions added too.\n\n**_PLEASE NOTE -\u003e you must update your service worker as described below!_**\n\n\nThis plugin has been used in [my blog](https://xiaoiver.github.io) so that you can see the effect.\n\n## Installation\n\nThis plugin is available as a [RubyGem][ruby-gem].\n\n### Option #1\n\nAdd `gem 'jekyll-pwa-plugin'` to the `jekyll_plugin` group in your `Gemfile`:\n\n```ruby\nsource 'https://rubygems.org'\n\ngem 'jekyll'\n\ngroup :jekyll_plugins do\n  gem 'jekyll-pwa-plugin'\nend\n```\n\nThen run `bundle` to install the gem.\n\n### Option #2\n\nAlternatively, you can also manually install the gem using the following command:\n\n```\n$ gem install jekyll-pwa-plugin\n```\n\nAfter the plugin has been installed successfully, add the following lines to your `_config.yml` in order to tell Jekyll to use the plugin:\n\n```\nplugins:\n- jekyll-pwa-plugin\n```\n\n## Getting Started\n\n### Configuration\n\nAdd the following configuration block to Jekyll's `_config.yml`:\n```yaml\npwa:\n  enabled: false # Optional\n  sw_src_filepath: service-worker.js # Optional\n  sw_dest_filename: service-worker.js # Optional\n  dest_js_directory: assets/js # Required\n  precache_recent_posts_num: 5 # Optional\n  precache_glob_directory: / # Optional\n  precache_glob_patterns: # Optional\n    - \"{js,css,fonts}/**/*.{js,css,eot,svg,ttf,woff}\"\n    - index.html\n  precache_glob_ignores: # Optional\n    - sw-register.js\n    - \"fonts/**/*\"\n```\n\nParameter                 | Description\n----------                | ------------\nenabled                   | Determines whether a sw will be registered and written to disk. Useful to disable when you run into problems in your development environment. Default is `true`.\nsw_src_filepath           | Filepath of the source service worker. Defaults to `service-worker.js`\nsw_dest_filename          | Filename of the destination service worker. Defaults to `service-worker.js`\ndest_js_directory         | Directory of JS in `_site`. During the build process, some JS like workbox.js will be copied to this directory so that service worker can import them in runtime.\nprecache_glob_directory   | Directory of precache. [Workbox Config](https://developers.google.com/web/tools/workbox/get-started/webpack#optional-config)\nprecache_glob_patterns    | Patterns of precache. [Workbox Config](https://developers.google.com/web/tools/workbox/get-started/webpack#optional-config)\nprecache_glob_ignores     | Ignores of precache. [Workbox Config](https://developers.google.com/web/tools/workbox/get-started/webpack#optional-config)\nprecache_recent_posts_num | Number of recent posts to precache.\n\nWe handle precache and runtime cache with the help of Google Workbox v5.1.4 in service worker.\n\n### Write your own Service Worker\n\nCreate a `service-worker.js` in the root path of your Jekyll project.\nYou can change this source file's path with `sw_src_filepath` option.\n\nNow you can write your own Service Worker with [Workbox APIs](https://developers.google.com/web/tools/workbox/reference-docs/latest/).\n\nHere's what the `service-worker.js` like in my site.\n```javascript\n// service-worker.js\n\n// set names for both precache \u0026 runtime cache\nworkbox.core.setCacheNameDetails({\n    prefix: 'my-blog',\n    suffix: 'v1.0',\n    precache: 'precache',\n    runtime: 'runtime-cache'\n});\n\n// let Service Worker take control of pages ASAP\nworkbox.core.skipWaiting();\nworkbox.core.clientsClaim();\n\n// let Workbox handle our precache list\nworkbox.precaching.precacheAndRoute(self.__precacheManifest);\n\n// use `NetworkFirst` strategy for html\nworkbox.routing.registerRoute(\n    /\\.html$/,\n    new workbox.strategies.NetworkFirst()\n);\n\n// use `NetworkFirst` strategy for css and js\nworkbox.routing.registerRoute(\n    /\\.(?:js|css)$/,\n    new workbox.strategies.NetworkFirst()\n);\n\n// use `CacheFirst` strategy for images\nworkbox.routing.registerRoute(\n    /assets\\/(img|icons)/,\n    new workbox.strategies.CacheFirst()\n);\n\n// use `StaleWhileRevalidate` third party files\nworkbox.routing.registerRoute(\n    /^https?:\\/\\/cdn.staticfile.org/,\n    new workbox.strategies.StaleWhileRevalidate()\n);\n```\n\n## Note\n\n### Generate a manifest.json?\n\nThis plugin won't generate a [manifest.json](https://developer.mozilla.org/en-US/docs/Web/Manifest). If you want to support this PWA feature, just add one in your root directory and Jekyll will copy it to `_site`.\n\n### When my site updates...\n\nSince the service worker has precached our assets such as `index.html`, JS files and other static files, we should notify user when our site has something changed. When these updates happen, the service worker will go into the `install` stage and request the newest resources, but the user must refresh current page so that these updates can be applied. A normal solution is showing a toast with the following text: `This site has changed, please refresh current page manually.`.\n\nThis plugin will dispatch a custom event called `sw.update` when the service worker has finished the update work. So in your site, you can choose to listen this event and popup a toast to remind users refreshing current page.\n\n# Contribute\n\nFork this repository, make your changes and then issue a pull request. If you find bugs or have new ideas that you do not want to implement yourself, file a bug report.\n\n# Copyright\n\nCopyright (c) 2017 Pan Yuqi.\n\nLicense: MIT\n\n[ruby-gem]: https://rubygems.org/gems/jekyll-pwa-plugin\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flavas-project%2Fjekyll-pwa","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flavas-project%2Fjekyll-pwa","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flavas-project%2Fjekyll-pwa/lists"}