penpot/frontend/scripts/watch.js

import proc from "node:child_process";
import fs from "node:fs/promises";
import ph from "node:path";

import log from "fancy-log";
import * as h from "./_helpers.js";
import ppt from "pretty-time";

const worker = h.startWorker();
let sass = null;

async function compileSassAll() {
  const start = process.hrtime();
  log.info("init: compile styles")

  sass = await h.compileSassAll(worker);
  let output = await h.concatSass(sass);
  await fs.writeFile("./resources/public/css/main.css", output);

  const end = process.hrtime(start);
  log.info("done: compile styles", `(${ppt(end)})`);
}

async function compileSass(path) {
  const start = process.hrtime();
  log.info("changed:", path);
  const result = await h.compileSass(worker, path, {modules:true});
  sass.index[result.outputPath] = result.css;

  const output = h.concatSass(sass);

  await fs.writeFile("./resources/public/css/main.css", output);

  const end = process.hrtime(start);
  log.info("done:", `(${ppt(end)})`);
}

await compileSassAll();
await h.copyAssets()
await h.compileSvgSprites()
await h.compileTemplates();
await h.compilePolyfills();

log.info("watch: scss src (~)")

h.watch("src", h.isSassFile, async function (path) {
  if (path.includes("common")) {
    await compileSassAll(path);
  } else {
    await compileSass(path);
  }
});

log.info("watch: scss: resources (~)")
h.watch("resources/styles", h.isSassFile, async function (path) {
  log.info("changed:", path);
  await compileSassAll()
});

log.info("watch: templates (~)")
h.watch("resources/templates", null, async function (path) {
  log.info("changed:", path);
  await h.compileTemplates();
});

log.info("watch: assets (~)")
h.watch(["resources/images", "resources/fonts", "resources/plugins-runtime"], null, async function (path) {
  log.info("changed:", path);
  await h.compileSvgSprites();
  await h.copyAssets();
  await h.compileTemplates();
});

worker.terminate();