vite-plugin-svelte-md 0.4.1 → 0.5.0

package/README.md

@@ -226,7 +226,7 @@ The class name of the div that wraps the content.
   </tr>
   <tr>
     <td>Frontmatter</td>
-    <td><a href="https://npmx.dev/package/gray-matter">✅ (YAML, JSON or JS)</a><br>
+    <td>✅ (YAML)<br>
     Accessible through <code>{frontmatter.variable}</code></td>
     <td>✅ (YAML, <a href="https://mdsvex.pngwn.io/docs#frontmatter">can be changed</a>)<br>
     Accessible through <code>{variable}</code>

package/lib/markdown.js

@@ -1,5 +1,6 @@
+import * as devalue from "devalue";
 import { createMarkdownExit } from "markdown-exit";
-import grayMatter from "gray-matter";
+import * as yaml from "yaml";
 import markdownItSvelteTags from "./markdown-it-svelte-tags/index.js";
 import markdownItSvelteCurlyBracesEscape from "./markdown-it-svelte-curly-braces-escape/index.js";
 import { toArray } from "./utils.js";
@@ -9,6 +10,21 @@ const SVELTE_TAGS_RE = /(<svelte:[a-z][^>]*>)([\s\S]*?)<\/svelte:[a-z]+>/gu;
 const GET_SVELTE_TAG_NAME_RE = /^svelte:[a-z]+/u;
 const IS_MODULE_CONTEXT_RE = /\bcontext\s*=\s*["']?module["']?/u;
 const IS_SVELTE_TAG_NAME_RE = /^svelte:[a-z]+$/u;
+const FRONTMATTER_RE = /^---(?:\r?\n|\r)(?:([\s\S]*?)(?:\r?\n|\r))?---(?:\r?\n|\r|$)/;
+/**
+ * Adapted from https://github.com/vfile/vfile-matter/blob/20c6193bb118f4c65488e0daaf2e66f5cafc733f/lib/index.js
+ * under MIT License: Copyright (c) Titus Wormer <tituswormer@gmail.com>
+ */
+function grayMatter(input) {
+    const match = FRONTMATTER_RE.exec(input);
+    if (match) {
+        return {
+            data: yaml.parse(match[1] || "") || {},
+            content: input.slice(match[0].length),
+        };
+    }
+    return { data: {}, content: input };
+}
 class TagContent {
     startTag = "";
     contents = [];
@@ -93,14 +109,13 @@ export function createMarkdownProcessor(options) {
         const raw = text.trimEnd();
         const { wrapperClasses, headEnabled } = options;
         const parsedFrontmatter = grayMatter(raw);
-        const plainMarkdown = parsedFrontmatter?.content ?? raw;
-        let html = await markdownIt.renderAsync(plainMarkdown, { id });
+        let html = await markdownIt.renderAsync(parsedFrontmatter.content, { id });
         if (wrapperClasses) {
             html = `<div class="${wrapperClasses}">${html}</div>`;
         }
         const parsedHtml = parseHtml(html);
-        const { head, frontmatter } = frontmatterPreprocess(parsedFrontmatter?.data ?? {}, options);
-        parsedHtml.moduleContext.prepend(`export const frontmatter = ${JSON.stringify(frontmatter)}`);
+        const { head, frontmatter } = frontmatterPreprocess(parsedFrontmatter.data, options);
+        parsedHtml.moduleContext.prepend(`export const frontmatter = ${devalue.uneval(frontmatter)};`);
         if (headEnabled && head) {
             let svelteHead = parsedHtml.svelteTags.find((tag) => tag.tagName === "svelte:head");
             if (!svelteHead) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-svelte-md",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "type": "module",
   "description": "Vite plugin to convert markdown to svelte template",
   "files": [
@@ -54,8 +54,9 @@
     "vite": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-beta.0"
   },
   "dependencies": {
-    "gray-matter": "^4.0.3",
-    "markdown-exit": "^1.0.0-beta.9"
+    "devalue": "^5.6.4",
+    "markdown-exit": "^1.0.0-beta.9",
+    "yaml": "^2.8.2 || ^3.0.0-0"
   },
   "devDependencies": {
     "@changesets/cli": "^2.29.5",