marp-dev-preview 0.1.9 → 0.1.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "marp-dev-preview",
-  "version": "0.1.9",
+  "version": "0.1.11",
   "description": "A CLI tool to preview Marp markdown files.",
   "main": "src/marp-dev-preview.mjs",
   "type": "module",

package/src/marp-dev-preview.mjs

@@ -7,7 +7,7 @@ import { fileURLToPath } from 'url';
 
 /* Sub-modules */
 import { createServer } from './server.mjs';
-import { initializeMarp, renderMarp as renderMarpInternal } from './marp-utils.mjs';
+import { initializeMarp, getMarp } from './marp-utils.mjs';
 import { parseArgs } from './args.mjs';
 
 const __filename = fileURLToPath(import.meta.url);
@@ -43,7 +43,7 @@ const wss = new WebSocketServer({ port: port + 1 });
 
 async function renderMarp() {
   const md = await fs.readFile(markdownFile, 'utf8');
-  const { html, css } = renderMarpInternal(md);
+  const { html, css } = getMarp().render(md);
   const customCss = `
 	svg[data-marpit-svg] {
 	  margin-bottom:20px !important;
@@ -125,7 +125,7 @@ async function renderMarp() {
 
 async function reload(markdown) {
   try {
-    const { html, css } = renderMarpInternal(markdown);
+    const { html, css } = getMarp().render(markdown);
     const message = JSON.stringify({
       type: 'update',
       html: html,
@@ -147,6 +147,24 @@ chokidar.watch(markdownFile).on('change', async () => {
   await reload(md);
 });
 
+if (themeSet) {
+  for (const themeDir of themeSet) {
+    console.debug('Watching themes:', path.join(themeDir, '*.css'))
+    chokidar.watch(themeDir).on('change', async (file) => {
+      // if not a css file, ignore
+      console.debug('Detected change in file :', file);
+      if (path.extname(file) !== '.css') return;
+
+      console.debug('Reloading theme from file :', file);
+
+      console.debug(`Theme file ${file} changed, updating...`);
+      await initializeMarp(themeSet);
+      const md = await fs.readFile(markdownFile, 'utf8');
+      await reload(md);
+    });
+  }
+}
+
 initializeMarp(themeSet).then(() => {
   createServer(port, markdownFile, markdownDir, renderMarp, reload, wss, __dirname);
 }).catch(error => {

package/src/marp-utils.mjs

@@ -8,6 +8,11 @@ import markdownItContainer from 'markdown-it-container';
 
 let marp;
 
+export function getMarp() {
+  return marp;
+}
+
+
 export async function initializeMarp(themeSet) {
   const options = { html: true, linkify: true, };
   marp = new Marp(options)
@@ -48,6 +53,6 @@ export async function initializeMarp(themeSet) {
 }
 
 export function renderMarp(markdown) {
-  const { html, css } = marp.render(markdown);
+  const { html, css } = getMarp().render(markdown);
   return { html, css };
 }