Add support for custom unified plugins (#39)

* Upgrade deps fs-extra and html-minifier-terser

* Upgrade unified deps and run audit fix

audit fix upgraded www subdep axios to 1.7.4 to resolve advisory CVE-2024-39338. Note: this didn't affect brut.

* Add rehype-slug plugin

* Disable update check in www dev server

* Add support for custom remark and rehype plugins

* Replace fs-extra with regular fs

This also moves types deps to the right package instead of listing them in the workspace package.json

* Delete old gitignore

* Ignore fs.rm exception when the directory doesn't exist

* Bump version

brut/package.json

@@ -1,6 +1,6 @@
 {
   "name": "brut",
-  "version": "0.0.35",
+  "version": "0.0.36",
   "private": false,
   "license": "MIT",
   "repository": {
@@ -16,15 +16,21 @@
   ],
   "bin": "entry.sh",
   "dependencies": {
-    "fs-extra": "^10.0.0",
-    "html-minifier-terser": "^6.0.2",
+    "html-minifier-terser": "^7.2.0",
     "js-yaml": "^4.1.0",
     "mustache": "^4.2.0",
-    "rehype-stringify": "^9.0.2",
-    "remark-gfm": "^3.0.0",
-    "remark-parse": "^10.0.0",
-    "remark-rehype": "^10.0.0",
-    "unified": "^10.1.0"
+    "rehype-slug": "^6.0.0",
+    "rehype-stringify": "^10.0.0",
+    "remark-gfm": "^4.0.0",
+    "remark-parse": "^11.0.0",
+    "remark-rehype": "^11.1.0",
+    "unified": "^11.0.5"
+  },
+  "devDependencies": {
+    "@types/html-minifier-terser": "^7.0.2",
+    "@types/js-yaml": "^4.0.9",
+    "@types/mustache": "^4.2.5",
+    "@types/node": "^22.3.0"
   },
   "engines": {
     "node": ">=18.0.0",

brut/src/buildPages.js

@@ -1,19 +1,18 @@
 /** @typedef {import('.').Config} Config */
 
-import fs from "fs-extra";
+import { writeFile, readFile, readdir, mkdir } from "fs/promises";
 import { resolve, basename, extname, dirname } from "path";
 import { cwd } from "process";
 import { load } from "js-yaml";
 import { unified } from "unified";
 import remarkParse from "remark-parse";
 import remarkGfm from "remark-gfm";
 import remarkRehype from "remark-rehype";
+import rehypeSlug from "rehype-slug";
 import rehypeStringify from "rehype-stringify";
 import mustache from "mustache";
 import { minify } from "html-minifier-terser";
 
-const { writeFile, readFile, readdir, mkdir } = fs;
-
 /** @typedef {{[x: string]: string}} Frontmatter */
 
 /**
@@ -43,9 +42,11 @@ function extractFrontmatter(file) {
  * Parse the file into an AST, transform with unified plugins,
  * and convert back into html.
  * @param {string} file
+ * @param {import('unified').Plugin[]} remarkPlugins
+ * @param {import('unified').Plugin[]} rehypePlugins
  * @returns {Promise<string>}
  */
-function processMarkdown(file) {
+function processMarkdown(file, remarkPlugins, rehypePlugins) {
   return (
     unified()
       /**
@@ -59,11 +60,24 @@ function processMarkdown(file) {
        * https://github.com/remarkjs/remark-gfm
        */
       .use(remarkGfm)
+      /**
+       * Custom remark plugins, from brut.config.js
+       */
+      .use(remarkPlugins)
       /**
        * `remark-rehype` transforms the mdast into hast.
        * https://github.com/remarkjs/remark-rehype
        */
       .use(remarkRehype, { allowDangerousHtml: true })
+      /**
+       * `rehype-slug` adds ids to HTML headings.
+       * https://github.com/rehypejs/rehype-slug
+       */
+      .use(rehypeSlug)
+      /**
+       * Custom rehype plugins, from brut.config.js
+       */
+      .use(rehypePlugins)
       /**
        * `rehype-stringify` transforms the hast into HTML.
        * https://github.com/rehypejs/rehype/tree/main/packages/rehype-stringify
@@ -325,6 +339,8 @@ export default async function buildPages({
   partialsDir,
   collections,
   processContext,
+  remarkPlugins,
+  rehypePlugins,
 }) {
   try {
     // run all filesystem ops in parallel
@@ -342,7 +358,7 @@ export default async function buildPages({
         const { path, content } = page;
         let html = content;
         if (path.endsWith(".md")) {
-          html = await processMarkdown(content);
+          html = await processMarkdown(content, remarkPlugins, rehypePlugins);
         }
         return { ...page, content: html };
       })

brut/src/index.js

@@ -1,10 +1,8 @@
-import fs from "fs-extra";
+import { mkdir, rm } from "fs/promises";
 import { cwd } from "process";
 import moveFiles from "./moveFiles";
 import buildPages from "./buildPages";
 
-const { emptyDir } = fs;
-
 /**
  * @typedef {Object} ConfigObject
  * @property {string} [pagesDir] The top-level directory containing pages. Defaults to `/pages`.
@@ -14,6 +12,8 @@ const { emptyDir } = fs;
  * @property {string} [outDir] The top-level directory for the build output. Defaults to `/dist`.
  * @property {string[]} [collections] Array of collections. Collection directories must be direct children of the `pagesDir`. Example: `["posts"]`.
  * @property {function} [processContext] A function that receives a context object for processing before it's handed over to mustache
+ * @property {import('unified').Plugin[]} [remarkPlugins] An array of remark plugins
+ * @property {import('unified').Plugin[]} [rehypePlugins] An array of rehype plugins
  */
 /** @typedef {Required<ConfigObject>} Config */
 
@@ -42,6 +42,8 @@ async function getConfig() {
       ? configObject.processContext
       : (context) => context,
     collections: configObject.collections || [],
+    remarkPlugins: configObject.remarkPlugins || [],
+    rehypePlugins: configObject.rehypePlugins || [],
   });
   return config;
 }
@@ -52,7 +54,8 @@ async function getConfig() {
 async function init() {
   console.time("Total build time");
   const config = await getConfig();
-  await emptyDir(config.outDir);
+  await rm(config.outDir, { recursive: true, force: true }); // force ignores the exception when dist doesn't exist (e.g. in CI)
+  await mkdir(config.outDir);
   await Promise.all([moveFiles(config), buildPages(config)]);
   console.timeEnd("Total build time");
 }

brut/src/moveFiles.js

@@ -1,8 +1,6 @@
 /** @typedef {import('.').Config} Config */
 
-import fs from "fs-extra";
-
-const { copy } = fs;
+import { cp } from "fs/promises";
 
 /**
  * @param {Config} config
@@ -11,7 +9,7 @@ const { copy } = fs;
 async function moveFiles({ publicDir, outDir }) {
   try {
     console.time("Moving static files");
-    await copy(publicDir, outDir);
+    await cp(publicDir, outDir, { recursive: true });
     console.timeEnd("Moving static files");
   } catch (error) {
     console.error(error);