update

src/renderer/App.tsx

@@ -82,12 +82,17 @@ marked.setOptions({
 // 🔥❓👉
 // 0️⃣1️⃣2️⃣3️⃣4️⃣5️⃣6️⃣7️⃣8️⃣9️⃣🔟
 // ©️⭐🔍〰️➖
+
+// 修改 marked 的解析规则
+const block = marked.Lexer.rules.block;
+// block.gfm.hr = /^( *[-*_]){3,} *(?:\n+|$)/;
+// 自定义水平线规则，确保它们在文档中被正确识别
+block.gfm.hr =
+  /^ {0,3}(?:(?:-[\t ]*){3,}|(?:_[ \t]*){3,}|(?:\*[ \t]*){3,})(?:\n+|$)/;
+
 const renderer = new marked.Renderer();
 // const originRenderer = _.cloneDeep(renderer);
 
-
-
-
 // 图片调整300px
 renderer.image = function (href, title, text) {
   // console.log("href, title, text", href, title, text);
@@ -166,19 +171,14 @@ renderer.text = function (text) {
 // 分隔符
 renderer.hr = function () {
   // return '<hr>\n';
-  return '➖➖➖➖➖<br/>';
+  // return '➖➖➖➖➖<br/>';
+  return '➖➖➖➖➖';
+
 };
 
-
-
 // 自定义分隔线解析规则
 // marked.Lexer.rules.block.gfm.hr = /^(\*{3,}|-{3,}|_{3,})(?:\s*)$/;
-
+//  hr = /^ {0,3}((?:-[\t ]*){3,}|(?:_[ \t]*){3,}|(?:\*[ \t]*){3,})(?:\n+|$)/;
-
-
-
-
-
 
 // 内联样式,使用直角引号「」
 renderer.codespan = function (text) {
@@ -250,19 +250,15 @@ renderer.link = function (href, title, text) {
   return out;
 };
 
-
+renderer.paragraph = function (text) {
-renderer.paragraph= function(text) {
   return `<p>${text}</p>\n`;
-}
+};
-renderer.br= function() {
+renderer.br = function () {
   return '<br>';
-}
+};
-renderer.html= function(html, block)  {
+renderer.html = function (html, block) {
   return html;
-}
+};
-
-
-
 
 // 使用拓展
 marked.use({ renderer });
@@ -298,14 +294,11 @@ const Index = () => {
 
   useEffect(() => {}, []);
 
-
-
   return (
     <div className="index">
       <div className="left">
         <TextArea
           // styles="background:#fff;width:100%;min-height:80px;padding:0 30rpx;"
-          // autoHeight
           className="TextArea"
           autoFocus
           allowClear
@@ -313,15 +306,19 @@ const Index = () => {
           showCount
         />
       </div>
-      {markText ? (
+      <div className="right">
+        <div className="rightHtml" dangerouslySetInnerHTML={{ __html: marked(markText) }}></div>
+      </div>
+
+      {/* {markText ? (
         <div
           className="right"
           dangerouslySetInnerHTML={{ __html: marked(markText) }}
         ></div>
-      ) : null}
+      ) : null} */}
-      <div className="origin">
+      {/* <div className="origin">
         <OriginMark markText={markText} />
-      </div>
+      </div> */}
     </div>
   );
 };

src/renderer/index.ejs

@@ -6,7 +6,7 @@
       http-equiv="Content-Security-Policy"
       content="script-src 'self' 'unsafe-inline'"
     />
-    <title>Hello Electron React!</title>
+    <title>emoji编辑器</title>
   </head>
   <body>
     <div id="root"></div>