refactor(ui/marked): replace pkg-level marked with new class instance (…

…#954) * refactor(ui/marked): replace pkg-level marked with new class instance * fix sidebar
ArtalkJS · Aug 18, 2024 · a925806 · a925806
1 parent b97167a
commit a925806
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 22 deletions.
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/ui/artalk-sidebar/src/components/Tab.vue b/ui/artalk-sidebar/src/components/Tab.vue
@@ -86,7 +86,7 @@ router.beforeEach((to, from) => {
 })
 
 router.afterEach((to, from, failure) => {
-  curtPage.value = to.name.replace(/^\//, '')
+  curtPage.value = String(to.name).replace(/^\//, '')
 })
 
 function showSearch() {

diff --git a/ui/artalk/package.json b/ui/artalk/package.json
@@ -117,7 +117,12 @@
   },
   "devDependencies": {
     "hanabi": "^0.4.0",
-    "insane": "^2.6.2",
+    "insane": "^2.6.2"
+  },
+  "dependencies": {
+    "marked": "^14.0.0"
+  },
+  "peerDependencies": {
     "marked": "^14.0.0"
   }
 }
diff --git a/ui/artalk/src/lib/marked.ts b/ui/artalk/src/lib/marked.ts
@@ -1,4 +1,5 @@
-import { marked as libMarked, MarkedOptions } from 'marked'
+import { Marked } from 'marked'
+import type { MarkedOptions } from 'marked'
 
 import { sanitize } from './sanitizer'
 import { renderCode } from './highlight'
@@ -7,7 +8,7 @@ import type { ArtalkConfig } from '@/types'
 
 type Replacer = (raw: string) => string
 
-let instance: typeof libMarked | undefined
+let instance: Marked | undefined
 let replacers: Replacer[] = []
 
 const markedOptions: MarkedOptions = {
@@ -33,21 +34,22 @@ export interface MarkedInitOptions {
 /** 初始化 marked */
 export function initMarked(options: MarkedInitOptions) {
   try {
-    if (!libMarked.name) return
+    if (!Marked.name) return
   } catch {
     return
   }
 
   // @see https://github.com/markedjs/marked/blob/4afb228d956a415624c4e5554bb8f25d047676fe/src/Tokenizer.js#L329
-  libMarked.setOptions({
+  const marked = new Marked()
+  marked.setOptions({
     renderer: getRenderer({
       imgLazyLoad: options.imgLazyLoad,
     }),
     ...markedOptions,
     ...options.markedOptions,
   })
 
-  instance = libMarked
+  instance = marked
 }
 
 /** 解析 markdown */

diff --git a/ui/artalk/src/types/config.ts b/ui/artalk/src/types/config.ts
@@ -1,3 +1,4 @@
+import type { MarkedOptions } from 'marked'
 import type { CommentData } from './data'
 import type { EditorApi } from './editor'
 import type { I18n } from '@/i18n'
@@ -133,7 +134,7 @@ export interface ArtalkConfig {
   markedReplacers?: ((raw: string) => string)[]
 
   /** Marked options */
-  markedOptions?: any // MarkedOptions
+  markedOptions?: MarkedOptions
 
   /** 列表请求参数修改器 */
   listFetchParamsModifier?: (params: any) => void

diff --git a/ui/artalk/src/types/context.ts b/ui/artalk/src/types/context.ts
@@ -1,3 +1,4 @@
+import type { Marked } from 'marked'
 import type {
   SidebarShowPayload,
   EventPayloadMap,
@@ -32,7 +33,7 @@ export interface ContextApi extends EventManagerFuncs<EventPayloadMap> {
   conf: ArtalkConfig
 
   /** marked 依赖对象 */
-  getMarked(): any | undefined
+  getMarked(): Marked | undefined
 
   /** 获取 API 以供 HTTP 请求 */
   getApi(): Api