suyono/blog-ts
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wip: added html handler in markdown

Browse Source
This commit is contained in:
Suyono 2024-05-13 18:24:06 +10:00
parent fe41df4244
commit 7252456dd4
3 changed files with 17 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/mark/page.tsx
View File

@ -1,7 +1,7 @@
import { unified } from 'unified'; import { unified } from 'unified';
import remarkGfm from 'remark-gfm'; import remarkGfm from 'remark-gfm';
import remarkParse from 'remark-parse'; import remarkParse from 'remark-parse';
import remarkRehype from 'remark-rehype'; import remarkRehype, { Options as RemarkRehypeOptions } from 'remark-rehype';
import rehypeSanitize from 'rehype-sanitize'; import rehypeSanitize from 'rehype-sanitize';
import rehypeHighlight, { Options as RehypeHighlightOptions } from 'rehype-highlight'; import rehypeHighlight, { Options as RehypeHighlightOptions } from 'rehype-highlight';
import rehypeReact, { Options as RehypeReactOptions } from 'rehype-react'; import rehypeReact, { Options as RehypeReactOptions } from 'rehype-react';
@ -9,13 +9,15 @@ import { all } from 'lowlight';
import { Fragment, jsx, jsxs } from 'react/jsx-runtime'; import { Fragment, jsx, jsxs } from 'react/jsx-runtime';
import { MarkPostString } from '@/components/dummyPost'; import { MarkPostString } from '@/components/dummyPost';
import { raleway, roboto, nunito } from "@/app/fonts"; import { raleway, roboto, nunito } from "@/app/fonts";
import rehypeRaw from "rehype-raw";
export default async function Mark() { export default async function Mark() {
let content = await MarkPostString(); let content = await MarkPostString();
let result = await unified() let result = await unified()
.use(remarkParse) .use(remarkParse)
.use(remarkGfm) .use(remarkGfm)
.use(remarkRehype) .use(remarkRehype, { allowDangerousHtml: true } as RemarkRehypeOptions)
.use(rehypeRaw)
.use(rehypeSanitize) .use(rehypeSanitize)
.use(rehypeHighlight, { .use(rehypeHighlight, {
languages: all, languages: all,

1
package.json
View File

@ -25,6 +25,7 @@
"react-remark": "^2.1.0", "react-remark": "^2.1.0",
"redis": "^4.6.13", "redis": "^4.6.13",
"rehype-highlight": "^7.0.0", "rehype-highlight": "^7.0.0",
"rehype-raw": "^7.0.0",
"rehype-react": "^8.0.0", "rehype-react": "^8.0.0",
"rehype-sanitize": "^6.0.0", "rehype-sanitize": "^6.0.0",
"rehype-stringify": "^10.0.0", "rehype-stringify": "^10.0.0",

12
pnpm-lock.yaml generated
View File

@ -56,6 +56,9 @@ importers:
rehype-highlight: rehype-highlight:
specifier: ^7.0.0 specifier: ^7.0.0
version: 7.0.0 version: 7.0.0
rehype-raw:
specifier: ^7.0.0
version: 7.0.0
rehype-react: rehype-react:
specifier: ^8.0.0 specifier: ^8.0.0
version: 8.0.0 version: 8.0.0
@ -1867,6 +1870,9 @@ packages:
rehype-highlight@7.0.0: rehype-highlight@7.0.0:
resolution: {integrity: sha512-QtobgRgYoQaK6p1eSr2SD1i61f7bjF2kZHAQHxeCHAuJf7ZUDMvQ7owDq9YTkmar5m5TSUol+2D3bp3KfJf/oA==} resolution: {integrity: sha512-QtobgRgYoQaK6p1eSr2SD1i61f7bjF2kZHAQHxeCHAuJf7ZUDMvQ7owDq9YTkmar5m5TSUol+2D3bp3KfJf/oA==}
rehype-raw@7.0.0:
resolution: {integrity: sha512-/aE8hCfKlQeA8LmyeyQvQF3eBiLRGNlfBJEvWH7ivp9sBqs7TNqBL5X3v157rM4IFETqDnIOO+z5M/biZbo9Ww==}
rehype-react@6.2.1: rehype-react@6.2.1:
resolution: {integrity: sha512-f9KIrjktvLvmbGc7si25HepocOg4z0MuNOtweigKzBcDjiGSTGhyz6VSgaV5K421Cq1O+z4/oxRJ5G9owo0KVg==} resolution: {integrity: sha512-f9KIrjktvLvmbGc7si25HepocOg4z0MuNOtweigKzBcDjiGSTGhyz6VSgaV5K421Cq1O+z4/oxRJ5G9owo0KVg==}
@ -4511,6 +4517,12 @@ snapshots:
unist-util-visit: 5.0.0 unist-util-visit: 5.0.0
vfile: 6.0.1 vfile: 6.0.1
rehype-raw@7.0.0:
dependencies:
'@types/hast': 3.0.4
hast-util-raw: 9.0.3
vfile: 6.0.1
rehype-react@6.2.1: rehype-react@6.2.1:
dependencies: dependencies:
'@mapbox/hast-util-table-cell-style': 0.2.1 '@mapbox/hast-util-table-cell-style': 0.2.1