Breaking: use workbox-build (#138)

* Use yarn 2, bump node requirements

* bump caniuse-lite, built via terser

* loosen node support as we are not publishing modules :(

* breaking: use workbox-build

* use GitHub CI

* fix typo

* fix build

* add tests for deprecation message

* run coverage

* tune docs

.github/ci.yml

@@ -0,0 +1,72 @@
+name: CI
+
+on: [push, pull_request]
+
+env:
+  YARN_NODE_LINKER: pnp # use pnp linker for better linking performance
+  YARN_ENABLE_SCRIPTS: false # disable post-install scripts
+
+jobs:
+  prepare-yarn-cache:
+    name: Prepare Cache
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Use Node.js latest
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: "*"
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: echo "::set-output name=dir::$(yarn config get cacheFolder)"
+      - uses: actions/cache@v2
+        id: yarn-cache
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: yarn-${{ hashFiles('yarn.lock') }}
+          restore-keys: |
+            yarn-
+      - name: Check Yarn dedupe
+        if: steps.yarn-cache.outputs.cache-hit != 'true'
+        run: |
+          yarn dedupe --check
+      - name: Check or update Yarn cache
+        env:
+        run: |
+          yarn install --immutable --skip-builds
+  test:
+    name: Test on Node.js # GitHub will add ${{ matrix.node-version }} to this title
+    needs: prepare-yarn-cache
+    runs-on: ${{ matrix.os }}
+    strategy:
+      matrix:
+        node-version: ["*", 14, 12]
+        os: ["ubuntu-latest", "windows-latest"]
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Use Node.js latest # Run yarn on latest node
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: "*" # Build Babel on latest node LTS versions
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: echo "::set-output name=dir::$(yarn config get cacheFolder)"
+      - uses: actions/cache@v2
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: yarn-${{ hashFiles('yarn.lock') }}
+      - name: Install
+        run: |
+          yarn install
+      - name: Use Node.js ${{ matrix.node-version }} # Checkout node version for test executor
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: ${{ matrix.node-version }}
+      - name: Test
+        run: |
+          yarn test --coverage
+      - name: Coveralls GitHub Action
+        if: matrix.node-version == '*'
+        uses: coverallsapp/github-action@v1.1.2

.github/workflows/ci.yml

@@ -0,0 +1,74 @@
+name: CI
+
+on: [push, pull_request]
+
+env:
+  YARN_NODE_LINKER: pnp # use pnp linker for better linking performance
+  YARN_ENABLE_SCRIPTS: false # disable post-install scripts
+
+jobs:
+  prepare-yarn-cache:
+    name: Prepare Cache
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Use Node.js latest
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: "*"
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: echo "::set-output name=dir::$(yarn config get cacheFolder)"
+      - uses: actions/cache@v2
+        id: yarn-cache
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: yarn-${{ hashFiles('yarn.lock') }}
+          restore-keys: |
+            yarn-
+      - name: Check Yarn dedupe
+        if: steps.yarn-cache.outputs.cache-hit != 'true'
+        run: |
+          yarn dedupe --check
+      - name: Check or update Yarn cache
+        run: |
+          yarn install --immutable --skip-builds
+  test:
+    name: Test on Node.js # GitHub will add ${{ matrix.node-version }} to this title
+    needs: prepare-yarn-cache
+    runs-on: ${{ matrix.os }}
+    strategy:
+      matrix:
+        node-version: ["*", 14, 12]
+        os: ["ubuntu-latest", "windows-latest"]
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Use Node.js latest # Run yarn on latest node
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: "*" # Build Babel on latest node LTS versions
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: echo "::set-output name=dir::$(yarn config get cacheFolder)"
+      - uses: actions/cache@v2
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: yarn-${{ hashFiles('yarn.lock') }}
+      - name: Install
+        run: |
+          yarn install
+      - name: Use Node.js ${{ matrix.node-version }} # Checkout node version for test executor
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: ${{ matrix.node-version }}
+      - name: Test
+        run: |
+          yarn test --coverage
+          yarn spellcheck
+      - name: Coveralls GitHub Action
+        if: matrix.node-version == '*'
+        uses: coverallsapp/github-action@v1.1.2
+        with:
+          github-token: ${{ secrets.github_token }}

.gitignore

@@ -41,3 +41,10 @@ jspm_packages
 
 # Built lib
 /lib/
+
+# Yarn 2
+.yarn/cache
+.yarn/unplugged
+.yarn/build-state.yml
+.yarn/install-state.gz
+.pnp.js

.yarnrc.yml

@@ -0,0 +1,2 @@
+yarnPath: ".yarn/releases/yarn-berry.cjs"
+nodeLinker: node-modules

.yaspellerrc

@@ -14,7 +14,8 @@
     "ServiceWorker",
     "sw",
     "travis",
-    "vuejs",
+    "v1",
+    "workbox",
     "yaspeller"
   ],
   "excludeFiles": [

README.md

@@ -1,17 +1,18 @@
 # hexo-offline
 
 [![npm version](https://img.shields.io/npm/v/hexo-offline.svg?style=flat-square)](https://www.npmjs.com/package/hexo-offline)
-[![Build Status](https://img.shields.io/travis/JLHwung/hexo-offline.svg?style=flat-square)](https://travis-ci.org/JLHwung/hexo-offline)
-[![AppVeyor build status](https://img.shields.io/appveyor/ci/JLHwung/hexo-offline.svg?style=flat-square)](https://ci.appveyor.com/project/JLHwung/hexo-offline)
+![Build Status](https://img.shields.io/github/workflow/status/JLHwung/hexo-offline/ci.svg?style=flat-square)
 [![Coverage Status](https://img.shields.io/coveralls/JLHwung/hexo-offline.svg?style=flat-square)](https://coveralls.io/github/JLHwung/hexo-offline)
 [![Dependencies Status](https://img.shields.io/david/JLHwung/hexo-offline.svg?style=flat-square)](https://david-dm.org/JLHwung/hexo-offline)
 [![Dev Dependencies Status](https://img.shields.io/david/dev/JLHwung/hexo-offline.svg?style=flat-square)](https://david-dm.org/JLHwung/hexo-offline?type=dev)
 
-hexo-offline is intended to provide offline experience for [hexo](https://hexo.io) built static website. It uses _ServiceWorker_ under the hood. Simply install this plugin to your website and it should be offline ready by caching most of static assets.
+hexo-offline is intended to provide [offline experience](https://web.dev/progressive-web-apps/) for [hexo](https://hexo.io) built static website. It uses _ServiceWorker_ under the hood. Simply install this plugin to your website and it should be offline ready by caching most of static assets.
+
+See [here](https://github.com/JLHwung/hexo-offline/tree/v1) for v1 docs.
 
 ## Demo
 
-- [vuejs.org](https://vuejs.org): Read Vuejs documentation in the flight.
+- [徑庭](https://jhuang.me)
 
 ## Install
 
@@ -25,21 +26,20 @@ Once installed, run `hexo clean && hexo generate` to activate offline experience
 
 If the website serves all content from the origin server, you don't have to add any config. Simply install and run `hexo clean && hexo generate`.
 
-While hexo-offline aims to provide zero-config offline enhancement to your hexo project, it does offer full list of options control from [sw-precache](https://github.com/GoogleChrome/sw-precache#options-parameter). Simply add your configuration to the root `_config.yml`.
+While hexo-offline aims to provide zero-config offline enhancement to your hexo project, it does offer full list of options control from [workbox-build](https://developers.google.com/web/tools/workbox/reference-docs/latest/module-workbox-build?hl=en#.generateSW). Create a `hexo-offline.config.cjs` in the hexo root directory
 
-```yaml
-# offline config passed to sw-precache.
-offline:
-  maximumFileSizeToCacheInBytes: 5242880
-  staticFileGlobs:
-    - public/**/*.{js,html,css,png,jpg,gif,svg,eot,ttf,woff,woff2}
-  stripPrefix: public
-  verbose: true
+```js
+// offline config passed to workbox-build.
+module.exports = {
+  globPatterns: ["**/*.{js,html,css,png,jpg,gif,svg,eot,ttf,woff}"],
+  globDirectory: "/path/to/hexo/public",
+  swDest: "/path/to/hexo/service-worker.js",
+},
 ```
 
-Again, the config is demonstration only and you don't have to copy and paste if you serves all contents from the origin server.
+Again, the config is demo only and you don't have to copy and paste if you serves all contents from the origin server.
 
-### How if content is served via CDN?
+### What if content is served via CDN?
 
 Suppose that you have used two CDN scripts:
 
@@ -48,21 +48,26 @@ Suppose that you have used two CDN scripts:
 - http://cdn.another-example.org/script-name/script-version.css
 ```
 
-Add this config to root `_config.yml`
-
-```yaml
-offline:
-  runtimeCaching:
-    - urlPattern: /*
-      handler: cacheFirst
-      options:
-        origin: cdn.example.com
-    - urlPattern: /*
-      handler: cacheFirst
-      options:
-        origin: cdn.another-example.org
+Add this config to root `hexo-offline.config.cjs`
+
+```js
+// offline config passed to workbox-build.
+module.exports = {
+  runtimeCaching: [
+    {
+      urlPattern: /^https:\/\/cdn\.example\.com\/.*/,
+      handler: "CacheFirst"
+    },
+    {
+      urlPattern: /^https:\/\/cdn\.another-example\.org\/.*/,
+      handler: "CacheFirst"
+    }
+  ]
+},
 ```
 
+For more information, see [Workbox Runtime Caching Entry](https://developers.google.com/web/tools/workbox/reference-docs/latest/module-workbox-build?hl=en#.RuntimeCachingEntry).
+
 Note:
 
 1. As the CDN resources is runtime cached, it means that the resource will be cached only after a user-agent visit the page where the resource is referenced. Therefore, if you have included a CDN resource `example.com/script.js` in `some-page.html` only, the user who visit `index.html` only would not have `example.com/script.js` in cache.

babel.config.json

@@ -0,0 +1,23 @@
+{
+  "presets": [
+    [
+      "@babel/preset-env",
+      {
+        "targets": { "node": "12.17" }
+      }
+    ]
+  ],
+  "overrides": [
+    {
+      "test": ["./src/lib/template.js"],
+      "presets": [
+        [
+          "@babel/preset-env",
+          {
+            "forceAllTransforms": true
+          }
+        ]
+      ]
+    }
+  ]
+}

husky.config.js

@@ -1,5 +1,5 @@
 module.exports = {
   hooks: {
-    "pre-commit": "lint-staged"
-  }
+    "pre-commit": "lint-staged",
+  },
 };

lint-staged.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  "*.{js,md,yml}": ["prettier --write", "git add"]
+  "*.{js,md,yml}": ["prettier --write"],
 };