使用 Vditor 后,Vue3 无法打包

在 Vite 建的 Vue3,Typescript 项目里,开发时,可以正常使用 Vditor,一旦使用 yarn build 打包项目,就会报错。

我专门建一个新项目,里面只添加一个 Vditor 的依赖,再次打包,依然失败。

这是写的代码

<template>
  <div id="vditor"></div>
</template>

<script lang="ts" setup>
import { onMounted } from "vue";
import Vditor from "vditor";

ref: vditor = null as null | Vditor;

onMounted(() => {
  initVditor()
})

const initVditor = () => {
  vditor = new Vditor("vditor", {
      height: 360,
      toolbarConfig: {
          pin: true,
      },
      cache: {
          enable: false,
      },
      after: () => {
          if (vditor)
              vditor.setValue('hello, Vditor + Vue!')
      }
  });
}
</script>
<style>
@import url(vditor/dist/index.css);
</style>

这是报错内容

yarn run v1.22.10
warning package.json: No license field
$ vue-tsc --noEmit && vite build
node_modules/vditor/dist/index.d.ts:1:23 - error TS2688: Cannot find type definition file for './types'.

1 /// <reference types="./types" />
                        ~~~~~~~

node_modules/vditor/dist/index.d.ts:6:13 - error TS2304: Cannot find name 'IVditor'.

6     vditor: IVditor;
              ~~~~~~~

node_modules/vditor/dist/index.d.ts:11:53 - error TS2304: Cannot find name 'IOptions'.

11     constructor(id: string | HTMLElement, options?: IOptions);
                                                       ~~~~~~~~

node_modules/vditor/dist/index.d.ts:64:22 - error TS2304: Cannot find name 'ICommentsData'.

64     getCommentIds(): ICommentsData[];
                        ~~~~~~~~~~~~~

node_modules/vditor/dist/method.d.ts:1:23 - error TS2688: Cannot find type definition file for './types'.

1 /// <reference types="./types" />
                        ~~~~~~~

node_modules/vditor/dist/method.d.ts:10:43 - error TS2304: Cannot find name 'IHljs'.

10     static highlightRender: (hljsOption?: IHljs, element?: HTMLElement | Document, cdn?: string) => void;
                                             ~~~~~

node_modules/vditor/dist/method.d.ts:14:16 - error TS2304: Cannot find name 'IMath'.

14         math?: IMath;
                  ~~~~~

node_modules/vditor/dist/method.d.ts:29:90 - error TS2304: Cannot find name 'IVditor'.

29     static outlineRender: (contentElement: HTMLElement, targetElement: Element, vditor?: IVditor) => string;
                                                                                            ~~~~~~~

node_modules/vditor/dist/method.d.ts:37:48 - error TS2304: Cannot find name 'IPreviewOptions'.

37     static md2html: (mdText: string, options?: IPreviewOptions) => Promise<string>;
                                                  ~~~~~~~~~~~~~~~

node_modules/vditor/dist/method.d.ts:39:82 - error TS2304: Cannot find name 'IPreviewOptions'.

39     static preview: (previewElement: HTMLDivElement, markdown: string, options?: IPreviewOptions) => Promise<void>;
                                                                                    ~~~~~~~~~~~~~~~


Found 10 errors.

error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
  • Vditor

    Vditor 是一款浏览器端的 Markdown 编辑器,支持所见即所得、即时渲染(类似 Typora)和分屏预览模式。它使用 TypeScript 实现,支持原生 JavaScript、Vue、React 和 Angular。

    145 引用 • 971 回帖

广告 我要投放

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...