Build Webpack in Pages workflow (#222)

.github/workflows/gh-pages.yaml

@@ -0,0 +1,86 @@
+name: Deploy Jekyll + Webpack build to Pages
+
+on:
+  # Runs on pushes targeting the default branch
+  push:
+    branches: ["main"]
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
+# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
+concurrency:
+  group: "pages"
+  cancel-in-progress: false
+
+jobs:
+  # Build job
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+      - name: Detect package manager
+        id: detect-package-manager
+        run: |
+          if [ -f "${{ github.workspace }}/yarn.lock" ]; then
+            echo "manager=yarn" >> $GITHUB_OUTPUT
+            echo "command=install" >> $GITHUB_OUTPUT
+            echo "runner=yarn" >> $GITHUB_OUTPUT
+            exit 0
+          elif [ -f "${{ github.workspace }}/package.json" ]; then
+            echo "manager=npm" >> $GITHUB_OUTPUT
+            echo "command=ci" >> $GITHUB_OUTPUT
+            echo "runner=npx --no-install" >> $GITHUB_OUTPUT
+            exit 0
+          else
+            echo "Unable to determine package manager"
+            exit 1
+          fi
+      - name: Setup Node
+        uses: actions/setup-node@v3
+        with:
+          node-version: "18"
+          cache: ${{ steps.detect-package-manager.outputs.manager }}
+      - name: Setup Pages
+        uses: actions/configure-pages@v3
+      - name: Restore cache
+        uses: actions/cache@v3
+        with:
+          path: |
+            index.html
+            ui.js
+            node_modules/.cache/webpack/
+          key: ${{ runner.os }}-webpack-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('index.html', 'ui.js') }}
+          restore-keys: |
+            ${{ runner.os }}-webpack-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
+      - name: Install dependencies
+        run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
+      - name: Build with Webpack
+        run: ${{ steps.detect-package-manager.outputs.runner }} build
+      - name: Build with Jekyll
+        uses: actions/jekyll-build-pages@v1
+        with:
+          source: ./
+          destination: ./_site
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v2
+
+  # Deployment job
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v2

.gitignore

@@ -8,8 +8,12 @@ coverage/
 **/local-examples/
 **/.DS_Store
 **/.sass-cache/
+_data/
 _site/
 dist/
 plugins-*/
+sw.js
+ui.js
+.jekyll-cache
 
 ipfs-core.min.js

Gemfile

@@ -3,3 +3,7 @@ source 'https://rubygems.org'
 gem "just-the-docs"
 gem "jekyll-remote-theme"
 
+
+gem "webrick", "~> 1.8"
+
+gem "jekyll-include-cache", "~> 0.2.1"

Gemfile.lock

@@ -29,6 +29,8 @@ GEM
       rouge (~> 3.0)
       safe_yaml (~> 1.0)
       terminal-table (~> 2.0)
+    jekyll-include-cache (0.2.1)
+      jekyll (>= 3.7, < 5.0)
     jekyll-remote-theme (0.4.3)
       addressable (~> 2.0)
       jekyll (>= 3.5, < 5.0)
@@ -69,13 +71,16 @@ GEM
     terminal-table (2.0.0)
       unicode-display_width (~> 1.1, >= 1.1.1)
     unicode-display_width (1.8.0)
+    webrick (1.8.1)
 
 PLATFORMS
   ruby
 
 DEPENDENCIES
+  jekyll-include-cache (~> 0.2.1)
   jekyll-remote-theme
   just-the-docs
+  webrick (~> 1.8)
 
 BUNDLED WITH
    2.2.27

_data/package.json

@@ -1,181 +0,0 @@
-{
-  "name": "replaywebpage",
-  "productName": "ReplayWeb.page",
-  "version": "1.8.11",
-  "description": "Serverless Web Archive Replay",
-  "repository": "https://github.com/webrecorder/replayweb.page",
-  "homepage": "https://replayweb.page/",
-  "author": "Webrecorder Software",
-  "license": "AGPL-3.0-or-later",
-  "dependencies": {
-    "@fortawesome/fontawesome-free": "^5.15.4",
-    "@shoelace-style/shoelace": "^2.7.0",
-    "@webrecorder/wabac": "^2.16.12",
-    "bulma": "^0.9.3",
-    "electron-log": "^4.4.1",
-    "electron-updater": "^5.3.0",
-    "fetch-ndjson": "^1.1.6",
-    "flexsearch": "^0.7.31",
-    "keyword-mark-element": "^0.2.0",
-    "lit": "^2.8.0",
-    "marked": "^4.0.10",
-    "mime-types": "^2.1.32",
-    "minimist": "^1.2.5",
-    "node-fetch": "^3.3.0",
-    "pretty-bytes": "^5.6.0",
-    "process": "^0.11.10",
-    "register-service-worker": "^1.7.2",
-    "split.js": "^1.6.4",
-    "stream-browserify": "^3.0.0"
-  },
-  "devDependencies": {
-    "copy-webpack-plugin": "^9.0.1",
-    "css-loader": "^6.2.0",
-    "electron": "^25.1.1",
-    "electron-builder": "^23.0.3",
-    "electron-notarize": "^1.1.1",
-    "eslint": "^8.23.1",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-plugin-lit": "^1.9.1",
-    "http-server": "^13.0.2",
-    "husky": "^8.0.0",
-    "lint-staged": "^14.0.0",
-    "mini-css-extract-plugin": "^2.3.0",
-    "node-sass": "^9.0.0",
-    "prettier": "^3.0.1",
-    "raw-loader": "^4.0.2",
-    "sass-loader": "^13.3.2",
-    "style-loader": "^3.2.1",
-    "svg-inline-loader": "^0.8.2",
-    "ts-loader": "^9.4.4",
-    "typescript": "^5.1.6",
-    "webpack": "^5.75.0",
-    "webpack-cli": "^5.0.1",
-    "webpack-dev-server": "^4.11.1"
-  },
-  "files": [
-    "/assets",
-    "/src",
-    "/ruffle",
-    "sw.js",
-    "ui.js",
-    "index.js",
-    "index.html"
-  ],
-  "scripts": {
-    "build": "webpack --mode production",
-    "build-dev": "webpack --mode development",
-    "build-docs": "bundle install; bundle exec jekyll build",
-    "start-dev": "webpack serve --mode development",
-    "start-prod": "http-server -p 9990",
-    "pack": "CSC_IDENTITY_AUTO_DISCOVERY=false electron-builder --publish never",
-    "pack-signed": "electron-builder",
-    "start-electron": "NODE_ENV=development electron ./dist/electron.js $1",
-    "start-jekyll": "yarn run build-docs && bundle exec jekyll serve",
-    "dist": "yarn run build && yarn run pack",
-    "dist-dev": "yarn run build-dev && yarn run pack",
-    "release": "yarn run build && electron-builder",
-    "lint": "eslint ./src/ webpack.config.js",
-    "format": "prettier --write ./src",
-    "prepare": "husky install"
-  },
-  "build": {
-    "afterSign": "build/notarize.js",
-    "productName": "ReplayWeb.page",
-    "asar": true,
-    "appId": "net.webrecorder.replaywebpage",
-    "artifactName": "${productName}-${version}.${ext}",
-    "extraMetadata": {
-      "main": "dist/electron.js"
-    },
-    "files": [
-      "!**/node_modules/**/*",
-      "dist/*.js",
-      "dist/prebuilds/${platform}-${arch}/*",
-      "dist/build/*",
-      "*.js",
-      "*.html",
-      "ruffle",
-      "webmanifest.json",
-      {
-        "from": "_site/assets",
-        "to": "assets"
-      }
-    ],
-    "dmg": {
-      "title": "ReplayWeb.page"
-    },
-    "mac": {
-      "category": "public.app-category.utilities",
-      "target": [
-        {
-          "target": "dmg",
-          "arch": "universal"
-        },
-        {
-          "target": "zip",
-          "arch": "universal"
-        }
-      ],
-      "hardenedRuntime": true,
-      "gatekeeperAssess": false,
-      "entitlements": "build/entitlements.mac.plist",
-      "entitlementsInherit": "build/entitlements.mac.plist",
-      "electronLanguages": [
-        "en"
-      ],
-      "extraResources": [
-        "plugins-mac"
-      ],
-      "singleArchFiles": "{dist/prebuilds,dist/prebuilds/**}"
-    },
-    "linux": {
-      "category": "Archiving;Utility;",
-      "target": [
-        "AppImage"
-      ],
-      "extraResources": [
-        "plugins-linux"
-      ]
-    },
-    "win": {
-      "target": "nsis",
-      "extraResources": [
-        "plugins-win"
-      ]
-    },
-    "directories": {
-      "buildResources": "build",
-      "output": "dist"
-    },
-    "fileAssociations": [
-      {
-        "ext": "warc",
-        "name": "WARC File",
-        "description": "WARC File",
-        "role": "Viewer"
-      },
-      {
-        "ext": "warc.gz",
-        "name": "WARC File",
-        "description": "WARC File",
-        "role": "Viewer"
-      },
-      {
-        "ext": "har",
-        "name": "HAR File",
-        "description": "HAR File",
-        "role": "Viewer"
-      },
-      {
-        "ext": "wacz",
-        "name": "WACZ File",
-        "description": "Web Archive Collection Zipped (WACZ)",
-        "role": "Viewer"
-      }
-    ]
-  },
-  "lint-staged": {
-    "*.ts": "prettier --write"
-  }
-}

webpack.config.js

@@ -99,6 +99,9 @@ const browserConfig = (/*env, argv*/) => {
   return {
     target: "web",
     mode: "production",
+    cache: {
+      type: isDevServer ? "memory" : "filesystem",
+    },
     resolve: {
       fallback: { "crypto": false },
       extensions: [".ts", ".js"],