From 0664006e92f4af0196c15f2e6c62a2d2d388f7c5 Mon Sep 17 00:00:00 2001 From: meteorlxy Date: Fri, 19 Aug 2022 14:48:45 +0800 Subject: [PATCH] refactor: migrate markdown toc plugin (#1093) (#1207) --- docs/config/app-configs.md | 12 +++++------- docs/guide/markdown.md | 5 +++-- package.json | 4 ++-- pnpm-lock.yaml | 37 +++++++++++++++++++++++++---------- src/node/markdown/markdown.ts | 18 +++++------------ 5 files changed, 42 insertions(+), 34 deletions(-) diff --git a/docs/config/app-configs.md b/docs/config/app-configs.md index b3d243c4..1875e4fc 100644 --- a/docs/config/app-configs.md +++ b/docs/config/app-configs.md @@ -148,10 +148,8 @@ interface MarkdownOptions extends MarkdownIt.Options { lineNumbers?: boolean // markdown-it-anchor plugin options. - // See: https://github.com/valeriangalliat/markdown-it-anchor - anchor?: { - permalink?: anchor.AnchorOptions['permalink'] - } + // See: https://github.com/valeriangalliat/markdown-it-anchor#usage + anchor?: anchorPlugin.AnchorOptions // markdown-it-attrs plugin options. // See: https://github.com/arve0/markdown-it-attrs @@ -162,9 +160,9 @@ interface MarkdownOptions extends MarkdownIt.Options { disable?: boolean } - // markdown-it-toc-done-right plugin options - // See: https://github.com/nagaozen/markdown-it-toc-done-right - toc?: any + // @mdit-vue/plugin-toc plugin options. + // See: https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-toc#options + toc?: TocPluginOptions // Configure the Markdown-it instance. config?: (md: MarkdownIt) => void diff --git a/docs/guide/markdown.md b/docs/guide/markdown.md index b86366fd..67f0fac7 100644 --- a/docs/guide/markdown.md +++ b/docs/guide/markdown.md @@ -435,12 +435,13 @@ const anchor = require('markdown-it-anchor') module.exports = { markdown: { // options for markdown-it-anchor - // https://github.com/valeriangalliat/markdown-it-anchor#permalinks + // https://github.com/valeriangalliat/markdown-it-anchor#usage anchor: { permalink: anchor.permalink.headerLink() }, - // options for markdown-it-toc-done-right + // options for @mdit-vue/plugin-toc + // https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-toc#options toc: { level: [1, 2] }, config: (md) => { diff --git a/package.json b/package.json index 80a1d414..775c0f5d 100644 --- a/package.json +++ b/package.json @@ -92,7 +92,8 @@ "vue": "^3.2.37" }, "devDependencies": { - "@mdit-vue/plugin-component": "^0.9.0", + "@mdit-vue/plugin-component": "^0.9.2", + "@mdit-vue/plugin-toc": "^0.9.2", "@rollup/plugin-alias": "^3.1.9", "@rollup/plugin-commonjs": "^22.0.2", "@rollup/plugin-json": "^4.1.0", @@ -136,7 +137,6 @@ "markdown-it-attrs": "^4.1.4", "markdown-it-container": "^3.0.0", "markdown-it-emoji": "^2.0.2", - "markdown-it-toc-done-right": "^4.2.0", "micromatch": "^4.0.5", "minimist": "^1.2.6", "npm-run-all": "^4.1.5", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0a78cef7..85e3e402 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -6,7 +6,8 @@ importers: specifiers: '@docsearch/css': ^3.2.1 '@docsearch/js': ^3.2.1 - '@mdit-vue/plugin-component': ^0.9.0 + '@mdit-vue/plugin-component': ^0.9.2 + '@mdit-vue/plugin-toc': ^0.9.2 '@rollup/plugin-alias': ^3.1.9 '@rollup/plugin-commonjs': ^22.0.2 '@rollup/plugin-json': ^4.1.0 @@ -54,7 +55,6 @@ importers: markdown-it-attrs: ^4.1.4 markdown-it-container: ^3.0.0 markdown-it-emoji: ^2.0.2 - markdown-it-toc-done-right: ^4.2.0 micromatch: ^4.0.5 minimist: ^1.2.6 npm-run-all: ^4.1.5 @@ -89,7 +89,8 @@ importers: vite: 3.0.8 vue: 3.2.37 devDependencies: - '@mdit-vue/plugin-component': 0.9.0 + '@mdit-vue/plugin-component': 0.9.2 + '@mdit-vue/plugin-toc': 0.9.2 '@rollup/plugin-alias': 3.1.9_rollup@2.78.0 '@rollup/plugin-commonjs': 22.0.2_rollup@2.78.0 '@rollup/plugin-json': 4.1.0_rollup@2.78.0 @@ -133,7 +134,6 @@ importers: markdown-it-attrs: 4.1.4_markdown-it@13.0.1 markdown-it-container: 3.0.0 markdown-it-emoji: 2.0.2 - markdown-it-toc-done-right: 4.2.0 micromatch: 4.0.5 minimist: 1.2.6 npm-run-all: 4.1.5 @@ -394,13 +394,34 @@ packages: engines: {node: '>=6.9.0'} dev: true - /@mdit-vue/plugin-component/0.9.0: - resolution: {integrity: sha512-HfrIQL8EiIyBeg42aSdTJJ/r2STI88fDFexPv7pI+a/qq1BG5AR0FTHTuzP3vwHn1ysgYB1qk4/hV/hodPYzhQ==} + /@mdit-vue/plugin-component/0.9.2: + resolution: {integrity: sha512-sTi9SWiakUGUs330zNRfEYSzGAVAXJ7gjbg46e/4HJQXxC8uEBC+Xg6IgsYcTRGHuJpCP65pcHvCLeDoCdWpyQ==} dependencies: '@types/markdown-it': 12.2.3 markdown-it: 13.0.1 dev: true + /@mdit-vue/plugin-toc/0.9.2: + resolution: {integrity: sha512-Du3fFz+YezlXex9Syn+bc8ADDRx/kBfBokeHXfd/qCW5XqS7I4THLR/IRqlvi9CgIZ0dx7bJv0avxil9EX1PoQ==} + dependencies: + '@mdit-vue/shared': 0.9.2 + '@mdit-vue/types': 0.9.2 + '@types/markdown-it': 12.2.3 + markdown-it: 13.0.1 + dev: true + + /@mdit-vue/shared/0.9.2: + resolution: {integrity: sha512-05Nk/o+kJCgeAa7oBGJOIazJq+6n0+VR4jPhzV3LGc9TyuMEqnrH5XzmBoy45vzyyoe7pGxJ/PBDxq4HebQHtQ==} + dependencies: + '@mdit-vue/types': 0.9.2 + '@types/markdown-it': 12.2.3 + markdown-it: 13.0.1 + dev: true + + /@mdit-vue/types/0.9.2: + resolution: {integrity: sha512-SuoxzZHS2/9bEqeJ+bjj2xBLjoZhRo6Ww/GVqNZS2ji9rkoM2teA0kbwSmj0X6Kf00K9HnLs6T0dtDtqpBqEHA==} + dev: true + /@nodelib/fs.scandir/2.1.5: resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} engines: {node: '>= 8'} @@ -2737,10 +2758,6 @@ packages: resolution: {integrity: sha512-zLftSaNrKuYl0kR5zm4gxXjHaOI3FAOEaloKmRA5hijmJZvSjmxcokOLlzycb/HXlUFWzXqpIEoyEMCE4i9MvQ==} dev: true - /markdown-it-toc-done-right/4.2.0: - resolution: {integrity: sha512-UB/IbzjWazwTlNAX0pvWNlJS8NKsOQ4syrXZQ/C72j+jirrsjVRT627lCaylrKJFBQWfRsPmIVQie8x38DEhAQ==} - dev: true - /markdown-it/13.0.1: resolution: {integrity: sha512-lTlxriVoy2criHP0JKRhO2VDG9c2ypWCsT237eDiLqi09rmbKoUetyGHq2uOIRoRS//kfoJckS0eUzzkDR+k2Q==} hasBin: true diff --git a/src/node/markdown/markdown.ts b/src/node/markdown/markdown.ts index b1961f2a..c3bf51a7 100644 --- a/src/node/markdown/markdown.ts +++ b/src/node/markdown/markdown.ts @@ -2,10 +2,9 @@ import MarkdownIt from 'markdown-it' import anchorPlugin from 'markdown-it-anchor' import attrsPlugin from 'markdown-it-attrs' import emojiPlugin from 'markdown-it-emoji' -import tocPlugin from 'markdown-it-toc-done-right' import { componentPlugin } from '@mdit-vue/plugin-component' +import { tocPlugin, type TocPluginOptions } from '@mdit-vue/plugin-toc' import { IThemeRegistration } from 'shiki' -import { parseHeader } from '../utils/parseHeader' import { highlight } from './plugins/highlight' import { slugify } from './plugins/slugify' import { highlightLinePlugin } from './plugins/highlightLines' @@ -26,9 +25,7 @@ export type ThemeOptions = export interface MarkdownOptions extends MarkdownIt.Options { lineNumbers?: boolean config?: (md: MarkdownIt) => void - anchor?: { - permalink?: anchorPlugin.AnchorOptions['permalink'] - } + anchor?: anchorPlugin.AnchorOptions attrs?: { leftDelimiter?: string rightDelimiter?: string @@ -36,8 +33,7 @@ export interface MarkdownOptions extends MarkdownIt.Options { disable?: boolean } theme?: ThemeOptions - // https://github.com/nagaozen/markdown-it-toc-done-right - toc?: any + toc?: TocPluginOptions externalLinks?: Record } @@ -95,15 +91,11 @@ export const createMarkdownRenderer = async ( slugify, permalink: anchorPlugin.permalink.ariaHidden({}), ...options.anchor - }) + } as anchorPlugin.AnchorOptions) .use(tocPlugin, { slugify, - level: [2, 3], - format: (x: string, htmlencode: (s: string) => string) => - htmlencode(parseHeader(x)), - listType: 'ul', ...options.toc - }) + } as TocPluginOptions) .use(emojiPlugin) // apply user config