Artalk icon indicating copy to clipboard operation
Artalk copied to clipboard

Types are breaking

Open Mister-Hope opened this issue 1 year ago • 3 comments

See https://github.com/ArtalkJS/Artalk/commit/170db0fc2a20e45fff201256e57150c447ba2c1f#diff-053321e287571cb967ea080e97a985fc8b87511b89ae85eb079a7c81ef7c22c9, it introduce markedOptions in config options, however, the package is not declaring @types/marked as deps, and marked itself does not have a type declaration file.

So it will lead to issues like this in downstream projects, since the option is not typed:


plugins/plugin-comment/src/client/helpers/comment.ts:17:7 - error TS2322: Type 'Ref<{ comment?: boolean | undefined; delay?: number | undefined; pageTitle?: string | undefined; server?: string | undefined; site?: string | undefined; placeholder?: string | undefined; ... 35 more ...; beforeSubmit?: ((editor: EditorApi, next: () => void) => void) | undefined; }>' is not assignable to type 'Ref<ArtalkOptions>'.
  Type '{ comment?: boolean | undefined; delay?: number | undefined; pageTitle?: string | undefined; server?: string | undefined; site?: string | undefined; placeholder?: string | undefined; ... 35 more ...; beforeSubmit?: ((editor: EditorApi, next: () => void) => void) | undefined; }' is not assignable to type 'ArtalkOptions'.
    Type '{ comment?: boolean | undefined; delay?: number | undefined; pageTitle?: string | undefined; server?: string | undefined; site?: string | undefined; placeholder?: string | undefined; ... 35 more ...; beforeSubmit?: ((editor: EditorApi, next: () => void) => void) | undefined; }' is not assignable to type 'Partial<Omit<ArtalkConfig, "el" | "pageKey">>'.
      Types of property 'markedOptions' are incompatible.
        Type '{ hooks?: { options: ...; preprocess: (markdown: string) => string; postprocess: (html: string) => string; processAllTokens: (tokens: TokensList | Token[]) => TokensList | Token[]; } | null | undefined; ... 8 more ...; silent?: boolean | undefined; } | undefined' is not assignable to type 'MarkedOptions | undefined'.
          Type '{ hooks?: { options: ...; preprocess: (markdown: string) => string; postprocess: (html: string) => string; processAllTokens: (tokens: TokensList | Token[]) => TokensList | Token[]; } | null | undefined; ... 8 more ...; silent?: boolean | undefined; }' is not assignable to type 'MarkedOptions'.
            Types of property 'tokenizer' are incompatible.
              Type '{ options: { hooks?: { options: ...; preprocess: (markdown: string) => string; postprocess: (html: string) => string; processAllTokens: (tokens: TokensList | Token[]) => TokensList | Token[]; } | null | undefined; ... 8 more ...; silent?: boolean | undefined; }; ... 25 more ...; inlineText: (src: string) => Text | u...' is not assignable to type '_Tokenizer | null | undefined'.
                Type '{ options: { hooks?: { options: ...; preprocess: (markdown: string) => string; postprocess: (html: string) => string; processAllTokens: (tokens: TokensList | Token[]) => TokensList | Token[]; } | null | undefined; ... 8 more ...; silent?: boolean | undefined; }; ... 25 more ...; inlineText: (src: string) => Text | u...' is not assignable to type '_Tokenizer'.
                  Types of property 'lexer' are incompatible.
                    Type '{ tokens: { [x: number]: { type: "space"; raw: string; } | { type: "code"; raw: string; codeBlockStyle?: "indented" | undefined; lang?: string | undefined; text: string; escaped?: boolean | undefined; } | ... 19 more ... | { ...; }; ... 35 more ...; links: Links; }; ... 5 more ...; inlineTokens: (src: string, tokens...' is missing the following properties from type '_Lexer': tokenizer, inlineQueue

17 const comment: Ref<CommentOptions> = ref(commentOptions)
         ~~~~~~~


Found 1 error.

image

Mister-Hope avatar May 11 '24 06:05 Mister-Hope

marked 新版已内置了 ts 类型声明,@types/marked package has been deprecated.

image

这个问题实际上是由于客户端环境没有安装 marked 而 artalk 的 ts 类型声明又文件 import 了它。我能想到的解决办法是将 markedOptions 的类型改为 any 忽略类型报错,有更好的解决方案吗?

qwqcode avatar May 11 '24 06:05 qwqcode

声明 marked 作为依赖对于下游环境来说可能更加友好,any能避免带来的安装时间增加,但对TS环境不友好。

Mister-Hope avatar May 11 '24 07:05 Mister-Hope

还有一种可以尝试的解决方案是使用 rollup-plugin-dts 之类的插件把 marked 的类型打包进去。

Mister-Hope avatar May 11 '24 07:05 Mister-Hope

Any timetable for new versions?

Mister-Hope avatar May 22 '24 06:05 Mister-Hope