如何自动语法高亮整个Quill编辑器中不含代码块和pre标签的部分？

可以使用第三方库 Prism.js 来实现此功能。具体来说，可以通过以下步骤进行：

<link href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/prism.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/components/prism-python.min.js"></script>
其中，prism.css 是 Prism.js 的样式文件，prism.js 是主要的脚本文件，prism-python.min.js 是需要高亮的语言文件，可以根据实际需要引入不同的语言文件。
使用 Quill 的 text-change 事件监听器来检测编辑器中文本内容的变化，然后在其中匹配需要高亮的内容，并添加相应的 class。
const editor = new Quill('#editor', {
  theme: 'snow'
editor.on('text-change', function(delta, oldDelta, source) {
  if (source === 'user') {
    const allText = editor.getText();
    const matches = allText.match(/[^(```)]*(?=(?:```))/gm);
    if (matches) {
      for (let i = 0; i < matches.length; i++) {
        const highlighted = Prism.highlight(matches[i], Prism.languages.python, 'python');
        editor.formatLine(i, 1, 'code-block');
        editor.formatText(i * 2, matches[i].length, 'highlighted');
        editor.clipboard.dangerouslyPasteHTML(i * 2 + 1, highlighted);
以上代码中的正则表达式可以将非代码块部分提取出来，formatLine、formatText 和 clipboard.dangerouslyPasteHTML 分别用于添加代码块的 class、添加高亮的 class 和插入高亮后的 HTML。
在 CSS 文件中定义代码块和高亮的样式，例如：
.code-block {
  white-space: pre-wrap;
  font-family: 'Source Code Pro', monospace;
  background-color: #efefef;
  padding: 10px;
.highlighted {
  color: #a8a8a8;
至此，当用户在 Quill 编