mavon-editor关闭cdn本地加载实现代码高亮-CFANZ编程社区

使用mavon-editor做编辑器时，发现代码并不高亮，打开控制台一看，原来是相关的资源请求了cdn。
cdn请求
虽然作者已经说明了本地加载的配置（https://github.com/hinesboy/mavonEditor/blob/master/doc/cn/no-cnd.md），但是没有顺利的配好copy-webpack-plugin。
现解决了此问题，下面将进行说明：

复制项目根目录/node_modules/mavon-editor/dist中的所有文件至根目录/public/md(新建文件夹)下
在使用mavon-editor组件的vue文件data中，添加如下配置

externalLink: {
    markdown_css: false,
    hljs_js: () => '/md/highlightjs/highlight.min.js',
    hljs_css: (css) => '/md/highlightjs/styles/' + css + '.min.css',
    hljs_lang: (lang) => '/md/highlightjs/languages/' + lang + '.min.js',
    katex_css: () => '/md/katex/katex.min.css',
    katex_js: () => '/md/katex/katex.min.js',
}

3.在 <mavon-editor> 标签中添加:external-link属性

<mavon-editor
            ref="md"
            placeholder="请输入文章内容..."
            :boxShadow="false"
            style="z-index: 1; border: 1px solid #d9d9d9; height: 50vh"
            v-model="content"
            :toolbars="toolbars"
            :external-link="externalLink"
          />

4.在文件最下方单独引入css

<style scoped>
@import '/md/markdown/github-markdown.min.css';
</style>

5.此时打开界面，代码就可以正常高亮了，但是控制台还存在一条错误：

此时找到github-markdown.min.css，删除掉最后一句即可。
在这里插入图片描述

参考文献：
https://www.pipipi.net/questions/13803.html
https://blog.csdn.net/weixin_50823456/article/details/120367087