vditor 自建 CDN

2,271 阅读1分钟

vditor 是一款开源的 md 编辑器。近期在项目种使用时,发现cdn.jsdelivr.net/npm/vditor@… 文件一直获取不到,导致编辑器无法正常显示。详情

由于 vditor 使用了按需加载的机制,默认 CDN 为 cdn.jsdelivr.net/npm/vditor@ 版本号,在内网环境下,或者在线 CDN 挂掉的情况下,编辑器就无法正常显示了。好在 vditor 允许用户自建 CDN。本文记录如何自建 vditor CDN。

步骤:

1. 拉取 vditor 源码

Github

git clone https://github.com/Vanessa219/vditor

2. 安装依赖,构建包。

npm install

npm build

将构建好的dist文件夹放在服务器的这个位置(data/static/vditor)

这里需要注意一下需要保留 dist 这个文件夹。

3. 起静态服务。

使用 nginx 配置静态服务。

nginx.conf image.png

4. 访问一下静态文件夹

image.png

5. 修改dist文件夹下的 index.min.js 和 method.min.js

点进去 index.min.js -> 搜索 cdn.jsdelivr.net 可以看到一个链接,替换为:

{your ip}/static/vditor

6. 修改项目中的配置

Vditor-CDN切换

在option中添加cdn

image.png