-
-
Notifications
You must be signed in to change notification settings - Fork 6
/
mdsvex.config.js
68 lines (60 loc) · 1.85 KB
/
mdsvex.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
import * as path from "path"
import { fileURLToPath } from "url"
import abbr from "remark-abbr"
import urls from "rehype-urls"
import slug from "rehype-slug"
import autoLinkHeadings from "rehype-autolink-headings"
import addClasses from "rehype-add-classes"
import { visit } from "unist-util-visit"
import { h } from "hastscript"
const dirname = path.resolve(fileURLToPath(import.meta.url), "../")
/**
* Modified from https://github.com/josestg/rehype-figure
*/
function figure() {
function buildFigure({ properties }) {
const figure = h("figure", null, [
h("img", { ...properties }),
properties.title ? h("figcaption", properties.title) : ""
])
return figure
}
return function (tree) {
visit(tree, { tagName: "p" }, (node, index) => {
const images = node.children
.filter((n) => n.tagName === "img")
.map((img) => buildFigure(img))
if (images.length === 0) return
tree.children[index] =
images.length === 1
? images[0]
: (tree.children[index] = h("div", null, images))
})
}
}
function processUrl(url, node) {
if (node.tagName === "a") {
node.properties.class = "text-link"
if (!url.href.startsWith("/")) {
// is external link
node.properties.target = "_blank"
node.properties.rel = "noopener"
}
}
}
export default {
extensions: [".svelte.md"],
layout: {
blog: path.join(dirname, "./src/routes/blog/_layout.svelte"),
work: path.join(dirname, "./src/routes/work/_layout.svelte")
},
smartypants: true,
remarkPlugins: [abbr], // adds support for footnote-like abbreviations
rehypePlugins: [
figure, // convert images into <figure> elements
[urls, processUrl], // adds rel and target to <a> elements
slug, // adds slug to <h1>-<h6> elements
[autoLinkHeadings, { behavior: "wrap" }], // adds a <a> around slugged <h1>-<h6> elements
[addClasses, { "ul,ol": "list" }] // add classes to these elements
]
}