const katex = require('katex');
const win: any = window;
win.katex = katex;

首先,引入katex

 @import '~katex/dist/katex.css';

然后,引入katex.css

editorConfig = {
placeholder: '文档详情',
modules: {
formula: true,
toolbar: {
container: [
[{ header: [1, 2, 3, false] }],
['bold', 'italic', 'underline'],
[{ 'list': 'ordered' }, { 'list': 'bullet' }],
[{ 'color': [] }, { 'background': [] }],
[{ 'font': [] }, { 'align': [] }],
['blockquote', 'code-block', 'formula', 'image', 'video'],
['activity']
]
}
}
};

最后,配置editor

Quill Editor使用公式的更多相关文章

  1. vue quill editor输入文字出现首字母的问题

    当使用vue quill editor输入中文时,第一个中文的汉语拼音第一个字母会显示如图. 解决的办法就是升级vue quill editor js文件的版本,目前的我升级之后ok的版本是 < ...

  2. angular4中引入quill editor

    1. npm install --save-dev @types/quill  安装types 2.npm install ng2-quill-editor --save 安装quill 3.配置ts ...

  3. 现代富文本编辑器Quill的内容渲染机制

    DevUI是一支兼具设计视角和工程视角的团队,服务于华为云DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师.官方网站:devui.designNg组件库:ng-devui(欢迎S ...

  4. Quill – 可以灵活自定义的开源的富文本编辑器

    Quill 的建立是为了解决现有的所见即所得(WYSIWYG)的编辑器本身就是所见即所得(指不能再扩张)的问题.如果编辑器不正是你想要的方式,这是很难或不可能对其进行自定义以满足您的需求. Quill ...

  5. 轻量级quill富文本编辑器

    因为公司产品需要在移动端编辑文本,所以发现了这个轻量级的好东西,网上也没找到比较好的案例,就自己总结了下,有兴趣的直接复制代码运行看看就知道啦! 下面是quill.js的CDN加速地址: <!- ...

  6. Quill 富文本编辑器

    Quill 富文本编辑器 https://quilljs.com/ https://github.com/quilljs/quill https://github.com/quilljs/awesom ...

  7. 富文本编辑器Quill(二)上传图片与视频

    image与video在Quill formats中属于Embeds,要在富文本中插入图片或者视频需要使用insertEmbed api. insertEmbed insertEmbed(index: ...

  8. 富文本编辑器Quill(一)简单介绍

    Quill是一个很流行的富文本编辑器,github上star大约21k: github:https://github.com/quilljs/quill/ 官网: https://quilljs.co ...

  9. 富文本编辑期Quill

    官方网站http://quilljs.com/ 使用方法 <!-- Create the toolbar container --> <div id="toolbar&qu ...

随机推荐

  1. Spring Boot 2.1.0 已发布,7 个重大更新!

    距离<重磅:Spring Boot 2.0 正式发布!>已经过去大半年了,而 Spring Boot 2.1.0 在 10 月底就发布了,我们来看下 Spring Boot 2.1.0 都 ...

  2. Vue -- 基础语法和使用

    Vue 渐进式 JavaScript 框架 通过对框架的了解与运用程度,来决定其在整个项目中的应用范围,最终可以独立以框架方式完成整个web前端项目 一.走进Vue 1.what -- 什么是Vue ...

  3. 开发属于自己的Web服务器

    本文基于.net core 的控制台程序作为服务端 main函数: class Program { static void Main(string[] args) { Console.WriteLin ...

  4. 剑指offer例题分享--8

    前言:继续分享,加油! 面试题44: 代码如下: #include<iostream> #include<stdlib.h> using namespace std; int ...

  5. Set存储元素为啥是唯一的(以HashSet为例源码分析)

    本文版权归 远方的风lyh和博客园共有,欢迎转载,但须保留此段声明,并给出原文链接,谢谢合作,如有错误之处忘不吝批评指正! 说些废话 以前面试的时候会遇到有人问Set 和list的区别 这个很好答,但 ...

  6. ES6躬行记(1)——let和const

    古语云:“纸上得来终觉浅,绝知此事要躬行”.的确,不管看了多少本书,如果自己不实践,那么就很难领会其中的精髓.自己研读过许多ES6相关的书籍和资料,平时工作中也会用到,但在用到时经常需要上搜索引擎中查 ...

  7. Spring Boot (一)快速入门

    一.关于Spring Boot 在开始了解Spring Boot之前,我们需要先了解一下Spring,因为Spring Boot的诞生和Spring是息息相关的,Spring Boot是Spring发 ...

  8. SpringBoot报错:java.lang.NoSuchMethodError: javax.servlet.ServletContext.getVirtualServerName()Ljava/lang/String;

    错误:java.lang.NoSuchMethodError: javax.servlet.ServletContext.getVirtualServerName()Ljava/lang/String ...

  9. Android studio 下 JNI 开发实例

    在AS中进行 NDK 开发之前,我们先来简单的介绍几个大家都容易搞懵的概念: 到底什么是JNI,什么是NDK? 何为“交叉编译”? 先看什么是 JNI?JNI 的全称就是 Java Native In ...

  10. JavaScript 系列博客(六)

    JavaScript 系列博客(六) 前言 本篇博客介绍 js 操作高级,通过 js 获取标签的全局属性.设置标签的全局属性,以及事件的绑定与取消.js 盒模型与 js 动画. 对象使用的高级 对象的 ...