From e604f0f6af461654830fe2c8b5670eb4c2e72e00 Mon Sep 17 00:00:00 2001 From: Youwen Wu Date: Sun, 7 Apr 2024 01:11:45 -0700 Subject: [PATCH] feat: sectionize parsed markdown for better toc functionality --- package.json | 1 + pnpm-lock.yaml | 42 ++++++++++++++++++++++++++ src/globals.d.ts | 2 ++ src/routes/blog/[year]/[slug]/+page.ts | 2 ++ 4 files changed, 47 insertions(+) diff --git a/package.json b/package.json index 4c0dd74..480a77a 100644 --- a/package.json +++ b/package.json @@ -60,6 +60,7 @@ "remark-math": "^6.0.0", "remark-parse": "^11.0.0", "remark-rehype": "^11.1.0", + "remark-sectionize": "^2.0.0", "svelte-radix": "^1.1.0", "svelte-sonner": "^0.3.21", "tailwind-merge": "^2.2.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2ecf674..447768b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -56,6 +56,9 @@ dependencies: remark-rehype: specifier: ^11.1.0 version: 11.1.0 + remark-sectionize: + specifier: ^2.0.0 + version: 2.0.0 svelte-radix: specifier: ^1.1.0 version: 1.1.0(svelte@4.2.12) @@ -1046,6 +1049,10 @@ packages: resolution: {integrity: sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==} dev: true + /@types/unist@2.0.10: + resolution: {integrity: sha512-IfYcSBWE3hLpBg8+X2SEa8LVkJdJEkT2Ese2aaLs3ptGdVtABxndrMaxuFlQ1qdFf9Q5rDvDpxI3WwgvKFAsQA==} + dev: false + /@types/unist@3.0.2: resolution: {integrity: sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==} dev: false @@ -3323,6 +3330,13 @@ packages: vfile: 6.0.1 dev: false + /remark-sectionize@2.0.0: + resolution: {integrity: sha512-B+sCNNQroXybxX5Gwu9xbkjFIgK6vHMwbgPM/CEzQTP2ODxUiBsQRBjoSC6XR+yPOkgHvXV83HWCNA8IZuvJKg==} + dependencies: + unist-util-find-after: 4.0.1 + unist-util-visit: 4.1.2 + dev: false + /remark-stringify@11.0.0: resolution: {integrity: sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==} dependencies: @@ -3853,6 +3867,13 @@ packages: vfile: 6.0.1 dev: false + /unist-util-find-after@4.0.1: + resolution: {integrity: sha512-QO/PuPMm2ERxC6vFXEPtmAutOopy5PknD+Oq64gGwxKtk4xwo9Z97t9Av1obPmGU0IyTa6EKYUfTrK2QJS3Ozw==} + dependencies: + '@types/unist': 2.0.10 + unist-util-is: 5.2.1 + dev: false + /unist-util-find-after@5.0.0: resolution: {integrity: sha512-amQa0Ep2m6hE2g72AugUItjbuM8X8cGQnFoHk0pGfrFeT9GZhzN5SW8nRsiGKK7Aif4CrACPENkA6P/Lw6fHGQ==} dependencies: @@ -3860,6 +3881,12 @@ packages: unist-util-is: 6.0.0 dev: false + /unist-util-is@5.2.1: + resolution: {integrity: sha512-u9njyyfEh43npf1M+yGKDGVPbY/JWEemg5nH05ncKPfi+kBbKBJoTdsogMu33uhytuLlv9y0O7GH7fEdwLdLQw==} + dependencies: + '@types/unist': 2.0.10 + dev: false + /unist-util-is@6.0.0: resolution: {integrity: sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==} dependencies: @@ -3885,6 +3912,13 @@ packages: '@types/unist': 3.0.2 dev: false + /unist-util-visit-parents@5.1.3: + resolution: {integrity: sha512-x6+y8g7wWMyQhL1iZfhIPhDAs7Xwbn9nRosDXl7qoPTSCy0yNxnKc+hWokFifWQIDGi154rdUqKvbCa4+1kLhg==} + dependencies: + '@types/unist': 2.0.10 + unist-util-is: 5.2.1 + dev: false + /unist-util-visit-parents@6.0.1: resolution: {integrity: sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw==} dependencies: @@ -3892,6 +3926,14 @@ packages: unist-util-is: 6.0.0 dev: false + /unist-util-visit@4.1.2: + resolution: {integrity: sha512-MSd8OUGISqHdVvfY9TPhyK2VdUrPgxkUtWSuMHF6XAAFuL4LokseigBnZtPnJMu+FbynTkFNnFlyjxpVKujMRg==} + dependencies: + '@types/unist': 2.0.10 + unist-util-is: 5.2.1 + unist-util-visit-parents: 5.1.3 + dev: false + /unist-util-visit@5.0.0: resolution: {integrity: sha512-MR04uvD+07cwl/yhVuVWAtw+3GOR/knlL55Nd/wAdblk27GCVt3lqpTivy/tkJcZoNPzTwS1Y+KMojlLDhoTzg==} dependencies: diff --git a/src/globals.d.ts b/src/globals.d.ts index 28bc0d6..b7f664c 100644 --- a/src/globals.d.ts +++ b/src/globals.d.ts @@ -8,3 +8,5 @@ interface BlogDocument { image?: string; description: string; } + +declare module 'remark-sectionize'; diff --git a/src/routes/blog/[year]/[slug]/+page.ts b/src/routes/blog/[year]/[slug]/+page.ts index 5a33efc..edd45bc 100644 --- a/src/routes/blog/[year]/[slug]/+page.ts +++ b/src/routes/blog/[year]/[slug]/+page.ts @@ -7,6 +7,7 @@ import remarkParse from 'remark-parse'; import remarkRehype from 'remark-rehype'; import remarkGfm from 'remark-gfm'; import remarkGhAlerts from 'remark-gh-alerts'; +import remarkSectionize from 'remark-sectionize'; export const prerender = true; @@ -16,6 +17,7 @@ export const load: PageLoad = async ({ fetch }) => { const content = String( await unified() .use(remarkParse) + .use(remarkSectionize) .use(remarkGfm) .use(remarkGhAlerts) .use(remarkMath)