feat: 引入了markdown

components/ua-markdown/lib/highlight/atom-one-dark.css

@@ -0,0 +1 @@
+pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#abb2bf;background:#282c34}.hljs-comment,.hljs-quote{color:#5c6370;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#c678dd}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#e06c75}.hljs-literal{color:#56b6c2}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#98c379}.hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#d19a66}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#61aeee}.hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_{color:#e6c07b}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs-link{text-decoration:underline}

components/ua-markdown/lib/highlight/atom-one-light.css

@@ -0,0 +1 @@
+pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#383a42;background:#fafafa}.hljs-comment,.hljs-quote{color:#a0a1a7;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#a626a4}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#e45649}.hljs-literal{color:#0184bb}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#50a14f}.hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#986801}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#4078f2}.hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_{color:#c18401}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs-link{text-decoration:underline}

components/ua-markdown/lib/highlight/github-dark.min.css

@@ -0,0 +1,10 @@
+pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
+  Theme: GitHub Dark
+  Description: Dark theme as seen on github.com
+  Author: github.com
+  Maintainer: @Hirse
+  Updated: 2021-05-15
+
+  Outdated base version: https://github.com/primer/github-syntax-dark
+  Current colors taken from GitHub's CSS
+*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}

components/ua-markdown/lib/html-parser.js

@@ -0,0 +1,352 @@
+/*
+ * HTML5 Parser By Sam Blowes
+ *
+ * Designed for HTML5 documents
+ *
+ * Original code by John Resig (ejohn.org)
+ * http://ejohn.org/blog/pure-javascript-html-parser/
+ * Original code by Erik Arvidsson, Mozilla Public License
+ * http://erik.eae.net/simplehtmlparser/simplehtmlparser.js
+ *
+ * ----------------------------------------------------------------------------
+ * License
+ * ----------------------------------------------------------------------------
+ *
+ * This code is triple licensed using Apache Software License 2.0,
+ * Mozilla Public License or GNU Public License
+ *
+ * ////////////////////////////////////////////////////////////////////////////
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License.  You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * ////////////////////////////////////////////////////////////////////////////
+ *
+ * The contents of this file are subject to the Mozilla Public License
+ * Version 1.1 (the "License"); you may not use this file except in
+ * compliance with the License. You may obtain a copy of the License at
+ * http://www.mozilla.org/MPL/
+ *
+ * Software distributed under the License is distributed on an "AS IS"
+ * basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the
+ * License for the specific language governing rights and limitations
+ * under the License.
+ *
+ * The Original Code is Simple HTML Parser.
+ *
+ * The Initial Developer of the Original Code is Erik Arvidsson.
+ * Portions created by Erik Arvidssson are Copyright (C) 2004. All Rights
+ * Reserved.
+ *
+ * ////////////////////////////////////////////////////////////////////////////
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU General Public License
+ * as published by the Free Software Foundation; either version 2
+ * of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ *
+ * ----------------------------------------------------------------------------
+ * Usage
+ * ----------------------------------------------------------------------------
+ *
+ * // Use like so:
+ * HTMLParser(htmlString, {
+ *     start: function(tag, attrs, unary) {},
+ *     end: function(tag) {},
+ *     chars: function(text) {},
+ *     comment: function(text) {}
+ * });
+ *
+ * // or to get an XML string:
+ * HTMLtoXML(htmlString);
+ *
+ * // or to get an XML DOM Document
+ * HTMLtoDOM(htmlString);
+ *
+ * // or to inject into an existing document/DOM node
+ * HTMLtoDOM(htmlString, document);
+ * HTMLtoDOM(htmlString, document.body);
+ *
+ */
+// Regular Expressions for parsing tags and attributes
+var startTag = /^<([-A-Za-z0-9_]+)((?:\s+[a-zA-Z_:][-a-zA-Z0-9_:.]*(?:\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|[^>\s]+))?)*)\s*(\/?)>/;
+var endTag = /^<\/([-A-Za-z0-9_]+)[^>]*>/;
+var attr = /([a-zA-Z_:][-a-zA-Z0-9_:.]*)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|([^>\s]+)))?/g; // Empty Elements - HTML 5
+
+var empty = makeMap('area,base,basefont,br,col,frame,hr,img,input,link,meta,param,embed,command,keygen,source,track,wbr'); // Block Elements - HTML 5
+// fixed by xxx 将 ins 标签从块级名单中移除
+
+var block = makeMap('a,address,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video'); // Inline Elements - HTML 5
+
+var inline = makeMap('abbr,acronym,applet,b,basefont,bdo,big,br,button,cite,code,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var'); // Elements that you can, intentionally, leave open
+// (and which close themselves)
+
+var closeSelf = makeMap('colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr'); // Attributes that have their values filled in disabled="disabled"
+
+var fillAttrs = makeMap('checked,compact,declare,defer,disabled,ismap,multiple,nohref,noresize,noshade,nowrap,readonly,selected'); // Special Elements (can contain anything)
+
+var special = makeMap('script,style');
+function HTMLParser(html, handler) {
+  var index;
+  var chars;
+  var match;
+  var stack = [];
+  var last = html;
+
+  stack.last = function () {
+    return this[this.length - 1];
+  };
+
+  while (html) {
+    chars = true; // Make sure we're not in a script or style element
+
+    if (!stack.last() || !special[stack.last()]) {
+      // Comment
+      if (html.indexOf('<!--') == 0) {
+        index = html.indexOf('-->');
+
+        if (index >= 0) {
+          if (handler.comment) {
+            handler.comment(html.substring(4, index));
+          }
+
+          html = html.substring(index + 3);
+          chars = false;
+        } // end tag
+
+      } else if (html.indexOf('</') == 0) {
+        match = html.match(endTag);
+
+        if (match) {
+          html = html.substring(match[0].length);
+          match[0].replace(endTag, parseEndTag);
+          chars = false;
+        } // start tag
+
+      } else if (html.indexOf('<') == 0) {
+        match = html.match(startTag);
+
+        if (match) {
+          html = html.substring(match[0].length);
+          match[0].replace(startTag, parseStartTag);
+          chars = false;
+        }
+      }
+
+      if (chars) {
+        index = html.indexOf('<');
+        var text = index < 0 ? html : html.substring(0, index);
+        html = index < 0 ? '' : html.substring(index);
+
+        if (handler.chars) {
+          handler.chars(text);
+        }
+      }
+    } else {
+      html = html.replace(new RegExp('([\\s\\S]*?)<\/' + stack.last() + '[^>]*>'), function (all, text) {
+        text = text.replace(/<!--([\s\S]*?)-->|<!\[CDATA\[([\s\S]*?)]]>/g, '$1$2');
+
+        if (handler.chars) {
+          handler.chars(text);
+        }
+
+        return '';
+      });
+      parseEndTag('', stack.last());
+    }
+
+    if (html == last) {
+      throw 'Parse Error: ' + html;
+    }
+
+    last = html;
+  } // Clean up any remaining tags
+
+
+  parseEndTag();
+
+  function parseStartTag(tag, tagName, rest, unary) {
+    tagName = tagName.toLowerCase();
+
+    if (block[tagName]) {
+      while (stack.last() && inline[stack.last()]) {
+        parseEndTag('', stack.last());
+      }
+    }
+
+    if (closeSelf[tagName] && stack.last() == tagName) {
+      parseEndTag('', tagName);
+    }
+
+    unary = empty[tagName] || !!unary;
+
+    if (!unary) {
+      stack.push(tagName);
+    }
+
+    if (handler.start) {
+      var attrs = [];
+      rest.replace(attr, function (match, name) {
+        var value = arguments[2] ? arguments[2] : arguments[3] ? arguments[3] : arguments[4] ? arguments[4] : fillAttrs[name] ? name : '';
+        attrs.push({
+          name: name,
+          value: value,
+          escaped: value.replace(/(^|[^\\])"/g, '$1\\\"') // "
+
+        });
+      });
+
+      if (handler.start) {
+        handler.start(tagName, attrs, unary);
+      }
+    }
+  }
+
+  function parseEndTag(tag, tagName) {
+    // If no tag name is provided, clean shop
+    if (!tagName) {
+      var pos = 0;
+    } // Find the closest opened tag of the same type
+    else {
+        for (var pos = stack.length - 1; pos >= 0; pos--) {
+          if (stack[pos] == tagName) {
+            break;
+          }
+        }
+      }
+
+    if (pos >= 0) {
+      // Close all the open elements, up the stack
+      for (var i = stack.length - 1; i >= pos; i--) {
+        if (handler.end) {
+          handler.end(stack[i]);
+        }
+      } // Remove the open elements from the stack
+
+
+      stack.length = pos;
+    }
+  }
+}
+
+function makeMap(str) {
+  var obj = {};
+  var items = str.split(',');
+
+  for (var i = 0; i < items.length; i++) {
+    obj[items[i]] = true;
+  }
+
+  return obj;
+}
+
+function removeDOCTYPE(html) {
+  return html.replace(/<\?xml.*\?>\n/, '').replace(/<!doctype.*>\n/, '').replace(/<!DOCTYPE.*>\n/, '');
+}
+
+function parseAttrs(attrs) {
+  return attrs.reduce(function (pre, attr) {
+    var value = attr.value;
+    var name = attr.name;
+
+    if (pre[name]) {
+			pre[name] = pre[name] + " " + value;
+    } else {
+			pre[name] = value;
+    }
+
+    return pre;
+  }, {});
+}
+
+function parseHtml(html) {
+  html = removeDOCTYPE(html);
+  var stacks = [];
+  var results = {
+    node: 'root',
+    children: []
+  };
+  HTMLParser(html, {
+    start: function start(tag, attrs, unary) {
+      var node = {
+        name: tag
+      };
+
+      if (attrs.length !== 0) {
+        node.attrs = parseAttrs(attrs);
+      }
+
+      if (unary) {
+        var parent = stacks[0] || results;
+
+        if (!parent.children) {
+          parent.children = [];
+        }
+
+        parent.children.push(node);
+      } else {
+        stacks.unshift(node);
+      }
+    },
+    end: function end(tag) {
+      var node = stacks.shift();
+      if (node.name !== tag) console.error('invalid state: mismatch end tag');
+
+      if (stacks.length === 0) {
+        results.children.push(node);
+      } else {
+        var parent = stacks[0];
+
+        if (!parent.children) {
+          parent.children = [];
+        }
+
+        parent.children.push(node);
+      }
+    },
+    chars: function chars(text) {
+      var node = {
+        type: 'text',
+        text: text
+      };
+
+      if (stacks.length === 0) {
+        results.children.push(node);
+      } else {
+        var parent = stacks[0];
+
+        if (!parent.children) {
+          parent.children = [];
+        }
+
+        parent.children.push(node);
+      }
+    },
+    comment: function comment(text) {
+      var node = {
+        node: 'comment',
+        text: text
+      };
+      var parent = stacks[0];
+
+      if (!parent.children) {
+        parent.children = [];
+      }
+
+      parent.children.push(node);
+    }
+  });
+  return results.children;
+}
+
+export default parseHtml;

components/ua-markdown/ua-markdown.vue

@@ -0,0 +1,318 @@
+<!-- uniapp vue3 markdown解析 -->
+<template>
+<view class="ua__markdown"><rich-text space="nbsp" :nodes="parseNodes(source)" @itemclick="handleItemClick"></rich-text></view>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue'
+	import MarkdownIt from './lib/markdown-it.min.js'
+import hljs from './lib/highlight/uni-highlight.min.js'
+import './lib/highlight/atom-one-dark.css'
+import parseHtml from './lib/html-parser.js'
+	const props = defineProps({
+		// 解析内容
+	source: String,
+	  showLine: { type: [Boolean, String], default: true }
+	})
+	
+	let copyCodeData = []
+ const markdown = MarkdownIt({
+		 html: true,
+	 highlight: function(str, lang) {
+		let preCode = ""
+		try {
+		preCode = hljs.highlightAuto(str).value
+		} catch (err) {
+		preCode = markdown.utils.escapeHtml(str);
+			}
+		const lines = preCode.split(/\n/).slice(0, -1)
+		// 添加自定义行号
+	let html = lines.map((item, index) => {
+		if( item == ''){
+			return ''
+			}
+				return '<li><span class="line-num" data-line="' + (index + 1) + '"></span>' + item +'</li>'
+			}).join('')
+		if(props.showLine) {
+			html = '<ol style="padding: 0px 30px;">' + html + '</ol>'
+			}else {
+		html = '<ol style="padding: 0px 7px;list-style:none;">' + html + '</ol>'
+			}
+	copyCodeData.push(str)
+		let htmlCode = `<div class="markdown-wrap">`
+				// #ifndef MP-WEIXIN
+			htmlCode += `<div style="color: #aaa;text-align: right;font-size: 12px;padding:8px;">`
+					htmlCode += `${lang}<a class="copy-btn" code-data-index="${copyCodeData.length - 1}" style="margin-left: 8px;">复制代码</a>`
+					htmlCode += `</div>`
+				// #endif
+		htmlCode += `<pre class="hljs" style="padding:10px 8px 0;margin-bottom:5px;overflow: auto;display: block;border-radius: 5px;"><code>${html}</code></pre>`;
+			htmlCode += '</div>'
+	return htmlCode
+	}
+	})
+const parseNodes = (value) => {
+	 if(!value) return
+		 // 解析<br />到\n
+	  value = value.replace(/<br>|<br\/>|<br \/>/g, "\n")
+	value = value.replace(/&nbsp;/g, " ")
+		 let htmlString = ''
+	if (value.split("```").length % 2) {
+		let mdtext = value
+		if(mdtext[mdtext.length-1] != '\n'){
+		mdtext += '\n'
+			}
+	  htmlString = markdown.render(mdtext)
+		} else {
+		htmlString = markdown.render(value)
+		}
+		// 解决小程序表格边框型失效问题
+htmlString = htmlString.replace(/<table/g, `<table class="table"`)
+		htmlString = htmlString.replace(/<tr/g, `<tr class="tr"`)
+	htmlString = htmlString.replace(/<th>/g, `<th class="th">`)
+htmlString = htmlString.replace(/<td/g, `<td class="td"`)
+	htmlString = htmlString.replace(/<hr>|<hr\/>|<hr \/>/g, `<hr class="hr">`)
+
+		// #ifndef APP-NVUE
+		return htmlString
+		// #endif
+		
+		// 将htmlString转成htmlArray，反之使用rich-text解析
+		// #ifdef APP-NVUE
+	return parseHtml(htmlString)
+		// #endif
+	}
+	
+// 复制代码
+const handleItemClick = (e) => {
+	let {attrs} = e.detail.node
+let {"code-data-index":codeDataIndex,"class":className} = attrs
+	if(className == 'copy-btn'){
+	uni.setClipboardData({
+		data: copyCodeData[codeDataIndex],showToast: false,
+		success() {
+			uni.showToast({
+				title: '复制成功',icon: 'none'
+				});
+				}
+			})
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.ua__markdown {
+	  font-size: 14px;line-height: 1.5; word-break: break-all;
+	  h1,h2,h3,h4,h5,h6 {
+	       font-family: inherit;font-weight: 500;line-height: 1.1;color: inherit;
+	    }
+	  h1,h2,h3 {margin-top: 20px;margin-bottom: 10px}
+	   h4,h5,h6 {margin-top: 10px;margin-bottom: 10px}
+	    .h1,h1 {font-size: 36px
+	    }
+	   .h2,h2 {font-size: 30px
+	    }
+	  .h3,h3 {font-size: 24px
+	    }
+	  .h4,h4 {font-size: 18px
+	    }
+	    .h5,h5 {font-size: 14px
+	    }
+	  .h6,h6 {font-size: 12px
+	    }
+	 a {
+	     background-color: transparent;color: #2196f3;
+	        text-decoration: none;
+	    }
+	 hr, ::v-deep .hr {
+	   margin-top: 20px;margin-bottom: 20px; border: 0; border-top: 1px solid #e5e5e5;
+	    }
+	    img { max-width: 35%;
+	    }
+	  p {margin: 0 0 10px}
+	  em {
+	      font-style: italic; font-weight: inherit;
+	    }
+	 ol,ul {
+	        margin-top: 0; margin-bottom: 10px;padding-left: 40px;
+	    }
+	  ol ol,ol ul,ul ol,ul ul {margin-bottom: 0;
+	    }
+	ol ol, ul ol {list-style-type: lower-roman;
+	    }
+	   ol ol ol, ul ul ol {list-style-type: lower-alpha;
+	    }
+	 dl {
+	    margin-top: 0;margin-bottom: 20px;
+	    }
+	  dt {font-weight: 600;
+	    }
+	dt, dd {line-height: 1.4;
+	    }
+	 .task-list-item { list-style-type: none;
+	    }
+	 .task-list-item input {
+	        margin: 0 .2em .25em -1.6em;vertical-align: middle;
+	    }
+	    pre {
+	       position: relative; z-index: 11;
+	    }
+	    code,kbd,pre,samp { font-family: Menlo,Monaco,Consolas,"Courier New",monospace;}
+	    code:not(.hljs) {
+	    padding: 2px 4px;font-size: 90%;color: #c7254e;background-color: #ffe7ee;border-radius: 4px;
+	    }
+code:empty {display: none;
+		}
+	  pre code.hljs {
+	      color: var(--vg__text-1); border-radius: 16px; background: var(--vg__bg-1);font-size: 12px;
+	    }
+.markdown-wrap {
+			font-size: 12px;margin-bottom: 10px;
+		}
+	    pre.code-block-wrapper {background: #2b2b2b;color: #f8f8f2;border-radius: 4px;overflow-x: auto;
+	        padding: 1em;
+	        position: relative;
+	    }
+	   pre.code-block-wrapper code {
+	        padding: auto;
+	        font-size: inherit;
+	        color: inherit;
+	        background-color: inherit;
+	        border-radius: 0;
+	    }
+	    .code-block-header__copy {
+	        font-size: 16px;margin-left: 5px;
+	    }
+	 abbr[data-original-title],abbr[title] {
+	        cursor: help;border-bottom: 1px dotted #777;
+	    }
+	    blockquote {
+	     padding: 10px 20px;margin: 0 0 20px;font-size: 17.5px;
+	        border-left: 5px solid #e5e5e5;
+	    }
+	 blockquote ol:last-child,blockquote p:last-child,blockquote ul:last-child {
+	        margin-bottom: 0
+	    }
+	blockquote .small,blockquote footer,blockquote small {
+	      display: block;font-size: 80%;line-height: 1.42857143;color: #777
+	    }
+	  blockquote .small:before,blockquote footer:before,blockquote small:before {
+	        content: '\2014 \00A0'
+	    }
+	    .blockquote-reverse,blockquote.pull-right {
+	        padding-right: 15px; padding-left: 0;
+	     text-align: right;border-right: 5px solid #eee;border-left: 0
+	    }
+	  .blockquote-reverse .small:before,.blockquote-reverse footer:before,.blockquote-reverse small:before,blockquote.pull-right .small:before,blockquote.pull-right footer:before,blockquote.pull-right small:before {
+	        content: ''
+	    }
+	  .blockquote-reverse .small:after,.blockquote-reverse footer:after,.blockquote-reverse small:after,blockquote.pull-right .small:after,blockquote.pull-right footer:after,blockquote.pull-right small:after {
+	        content: '\00A0 \2014'
+	    }
+	   .footnotes {
+	      -moz-column-count: 2;
+	        -webkit-column-count: 2;
+	     column-count: 2
+	    }
+	    .footnotes-list {padding-left: 2em}
+	   table, ::v-deep .table {
+	    border-spacing: 0;border-collapse: collapse; width: 100%;max-width: 65em; overflow: auto;margin-top: 0;
+	        margin-bottom: 16px;
+	    }
+	  table tr, ::v-deep .table .tr {
+	   border-top: 1px solid #e5e5e5;
+	    }
+	    table th, table td, ::v-deep .table .th, ::v-deep .table .td {
+	  padding: 6px 13px;border: 1px solid #e5e5e5;
+	    }
+	    table th, ::v-deep .table .th {
+	      font-weight: 600;background-color: #eee;
+	    }
+	    .hljs[class*=language-]:before {
+	    position: absolute; z-index: 3;top: .8em; right: 1em; font-size: .8em; color: #999;
+	    }
+	    .hljs[class~=language-js]:before {
+     content: "js"
+    }
+    .hljs[class~=language-ts]:before {
+        content: "ts"
+    }
+    .hljs[class~=language-html]:before {
+        content: "html"
+}
+.hljs[class~=language-md]:before {
+    content: "md"
+}
+.hljs[class~=language-vue]:before {
+    content: "vue"
+}
+.hljs[class~=language-css]:before {
+    content: "css"
+}
+    .hljs[class~=language-sass]:before {
+        content: "sass"
+    }
+    .hljs[class~=language-scss]:before {
+        content: "scss"
+    }
+.hljs[class~=language-less]:before {
+    content: "less"
+}
+    .hljs[class~=language-stylus]:before {
+        content: "stylus"
+    }
+    .hljs[class~=language-go]:before {
+        content: "go"
+    }
+    .hljs[class~=language-java]:before {
+    content: "java"
+}
+.hljs[class~=language-c]:before {
+    content: "c"
+}
+.hljs[class~=language-sh]:before {
+    content: "sh"
+}
+    .hljs[class~=language-yaml]:before {
+        content: "yaml"
+}
+    .hljs[class~=language-py]:before {
+        content: "py"
+}
+.hljs[class~=language-docker]:before {
+    content: "docker"
+}
+.hljs[class~=language-dockerfile]:before {
+    content: "dockerfile"
+	}
+	.hljs[class~=language-makefile]:before {
+	    content: "makefile"
+}
+.hljs[class~=language-javascript]:before {
+    content: "js"
+}
+.hljs[class~=language-typescript]:before {
+        content: "ts"
+    }
+    .hljs[class~=language-markup]:before {
+        content: "html"
+}
+.hljs[class~=language-markdown]:before {
+    content: "md"
+}
+    .hljs[class~=language-json]:before {
+        content: "json"
+    }
+    .hljs[class~=language-ruby]:before {
+        content: "rb"
+    }
+	    .hljs[class~=language-python]:before {
+	        content: "py"
+	    }
+    .hljs[class~=language-bash]:before {
+        content: "sh"
+    }
+    .hljs[class~=language-php]:before {
+        content: "php"
+    }
+	}
+</style>

package.json

@@ -1,5 +1,6 @@
 {
   "dependencies": {
-    "lottie-web": "^5.13.0"
+    "lottie-web": "^5.13.0",
+    "vue-element-plus-x": "^1.3.0"
   }
 }

pages/chat/ChatCardAI.vue

@@ -1,12 +1,15 @@
 <template>
 	<view class="chat-ai">
-		<text>{{ text }}</text>
+		<!-- <text>{{ text }}</text> -->
+		<!-- <XMarkdown :markdown="text"/> -->
+		<ua-markdown :source="text" />
 		<slot></slot>
 	</view>
 </template>
 
 <script setup>
 	import { defineProps } from "vue";
+	
 	defineProps({
 	  text: {
 	    type: String,

readme.md

@@ -0,0 +1,49 @@
+
+# vue3版本！！！
+vue2版本已经上线，欢迎下载使用。
+[https://ext.dcloud.net.cn/plugin?id=13864](https://ext.dcloud.net.cn/plugin?id=13864)
+
+## uniapp markdown渲染解析.md语法及代码高亮
+> **组件名：uaMarkdown**
+> 代码块： `<ua-markdown>`
+
+
+uaMarkdown组件是基于uniapp+vue3自定义解析markdown语法结构插件、支持代码块高亮，编译兼容H5+小程序端+App端。
+
+
+### 引入方式
+
+本组件符合[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)规范，只需将本组件`ua-markdown`放在components目录，在页面`template`中即可直接使用。
+
+
+### 基本用法 
+
+**示例**
+
+- 基础用法
+
+```html
+const mdvalue = '### uniapp markdwon'
+<ua-markdown :source="mdvalue" />
+```
+
+- 去掉代码块行号
+
+```html
+<ua-markdown :source="xxx" :showLine="false" />
+```
+
+
+### API
+
+### uaMarkdown Props 
+
+|属性名|类型|默认值|说明|
+|:-:|:-:|:-:|:-:|
+|source|String|-| 渲染解析内容 |
+|showLine|Boolean|true| 是否显示代码块行号 |
+
+
+### 💝最后
+
+开发不易，希望各位小伙伴们多多支持下哈~~ ☕️☕️