add pre 增加pre语法（四个空格变成代码块）

src/Cherry.config.js

@@ -89,6 +89,18 @@ const defaultConfig = {
         customRenderer: {
           // 自定义语法渲染器
         },
+        /**
+         * indentedCodeBlock是缩进代码块是否启用的开关
+         *
+         *    在6.X之前的版本中默认不支持该语法。
+         *    因为cherry的开发团队认为该语法太丑了（容易误触）
+         *    开发团队希望用```代码块语法来彻底取代该语法
+         *    但在后续的沟通中，开发团队发现在某些场景下该语法有更好的显示效果
+         *    因此开发团队在6.X版本中才引入了该语法
+         *    已经引用6.x以下版本的业务如果想做到用户无感知升级，可以去掉该语法：
+         *        indentedCodeBlock：false
+         */
+        indentedCodeBlock: true,
       },
       emoji: {
         useUnicode: true, // 是否使用unicode进行渲染

src/Editor.js

@@ -57,6 +57,7 @@ export default class Editor {
         lineNumbers: false, // 显示行数
         cursorHeight: 0.85, // 光标高度，0.85好看一些
         indentUnit: 4, // 缩进单位为4
+        tabSize: 4, // 一个tab转换成的空格数量
         // styleActiveLine: false, // 当前行背景高亮
         // matchBrackets: true, // 括号匹配
         mode: 'markdown',

src/core/hooks/CodeBlock.js

@@ -35,6 +35,7 @@ export default class CodeBlock extends ParagraphBase {
     this.customParser = {};
     this.wrap = config.wrap; // 超出是否换行
     this.lineNumber = config.lineNumber; // 是否显示行号
+    this.indentedCodeBlock = typeof config.indentedCodeBlock === 'undefined' ? true : config.indentedCodeBlock; // 是否支持缩进代码块
     if (config && config.customRenderer) {
       this.customLang = Object.keys(config.customRenderer).map((lang) => lang.toLowerCase());
       this.customParser = { ...config.customRenderer };
@@ -196,9 +197,66 @@ export default class CodeBlock extends ParagraphBase {
     return cacheCode;
   }
 
+  /**
+   * 获取缩进代码块语法的正则
+   */
+  $getIndentedCodeReg() {
+    const ret = {
+      begin: '(?:^|\\n\\s*\\n)(?: {4}|\\t)',
+      end: '(?=$|\\n( {0,3}[^ \\t\\n]|\\n[^ \\t\\n]))',
+      content: '([\\s\\S]+?)',
+    };
+    return new RegExp(ret.begin + ret.content + ret.end, 'g');
+  }
+
+  /**
+   * 生成缩进代码块（没有行号、没有代码高亮）
+   */
+  $getIndentCodeBlock(str) {
+    if (!this.indentedCodeBlock) {
+      return str;
+    }
+    return this.$recoverCodeInIndent(str).replace(this.$getIndentedCodeReg(), (match, code) => {
+      const lineCount = (match.match(/\n/g) || []).length - 1;
+      const sign = this.$engine.md5(match);
+      const html = `<pre data-sign="${sign}" data-lines="${lineCount}">${escapeHTMLSpecialChar(
+        code.replace(/\n( {4}|\t)/g, '\n'),
+      )}</pre>`;
+      // return this.getCacheWithSpace(this.pushCache(html), match, true);
+      return this.pushCache(html, sign, lineCount);
+    });
+  }
+
+  /**
+   * 预处理缩进代码块，将缩进代码块里的高亮代码块和行内代码进行占位处理
+   */
+  $replaceCodeInIndent(str) {
+    if (!this.indentedCodeBlock) {
+      return str;
+    }
+    return str.replace(this.$getIndentedCodeReg(), (match) => {
+      return match.replace(/`/g, '~~~IndentCode');
+    });
+  }
+
+  /**
+   * 恢复预处理的内容
+   */
+  $recoverCodeInIndent(str) {
+    if (!this.indentedCodeBlock) {
+      return str;
+    }
+    return str.replace(this.$getIndentedCodeReg(), (match) => {
+      return match.replace(/~~~IndentCode/g, '`');
+    });
+  }
+
   beforeMakeHtml(str, sentenceMakeFunc, markdownParams) {
     let $str = str;
 
+    // 预处理缩进代码块
+    $str = this.$replaceCodeInIndent($str);
+
     $str = $str.replace(this.RULE.reg, (match, leadingContent, lang, code) => {
       let $code = code;
       const { sign, lines } = this.computeLines(match, leadingContent, code);
@@ -262,6 +320,10 @@ export default class CodeBlock extends ParagraphBase {
       });
       $str = $str.replace(/~~not~inlineCode/g, '\\`');
     }
+
+    // 处理缩进代码块
+    $str = this.$getIndentCodeBlock($str);
+
     return $str;
   }
 

src/sass/cherry.scss

@@ -469,7 +469,7 @@
     font-size: 0.9em;
   }
 
-  .cm-s-default .cm-whitespace {
+  .cm-s-default .cm-whitespace, .cm-tab {
     font-family: $monospaceFont;
     font-size: 0.9em;
   }

src/sass/markdown.scss

@@ -190,6 +190,15 @@
     margin: 0 0 $elementGap;
   }
 
+  pre {
+    padding: 16px;
+    overflow: auto;
+    font-size: 85%;
+    line-height: 1.45;
+    background-color: #f6f8fa;
+    border-radius: 6px;
+  }
+
   // 适配历史文章样式
   @import 'prettyprint/prettyprint.scss';