Source

import crypto from "node:crypto";
import fs from "node:fs";
import { defineConfig, type Plugin } from "vite";
import react from "@vitejs/plugin-react";

// Writes the service worker, which keeps the app shell and every course file on the device so Lingo
// opens and runs lessons with no connection once it has loaded.
function serviceWorker(): Plugin {
  return {
    name: "lingo-sw",
    apply: "build",
    generateBundle(_, bundle) {
      const pub = fs.readdirSync("public", { recursive: true, encoding: "utf8" })
        .filter((f) => fs.statSync(`public/${f}`).isFile() && !f.startsWith("art/card-blog"));
      const shell = ["/", ...[...Object.keys(bundle).filter((f) => f !== "index.html"), ...pub].map((f) => `/${f}`)];
      const hash = crypto.createHash("sha256").update(shell.join("\n"));
      for (const f of Object.values(bundle)) hash.update(f.type === "chunk" ? f.code : f.source);
      for (const f of pub) hash.update(fs.readFileSync(`public/${f}`));
      const source = fs.readFileSync("src/sw.js", "utf8")
        .replace("__VERSION__", hash.digest("hex").slice(0, 12))
        .replace("__SHELL__", JSON.stringify(shell));
      this.emitFile({ type: "asset", fileName: "sw.js", source });
    },
  };
}

export default defineConfig({
  plugins: [react(), serviceWorker()],
  server: { port: 4331, strictPort: true },
  preview: { port: 4331, strictPort: true },
  build: { target: "es2020", chunkSizeWarningLimit: 1500 },
});