摘要：是一个可将转为微信小程序的渲染库。用于解决在微信小程序中不能直接渲染的问题。依赖环境需要环境。已经安装请忽略安装接口使用转转转数据转数据示例将添加为小程序工程再克隆到目录使用小程序开发工具编译即可
Towxml
Towxml 是一个可将HTML、Markdown转为微信小程序WXML(WeiXin Markup Language)的渲染库。
用于解决在微信小程序中Markdown、HTML不能直接渲染的问题。
特色支持代码语法高亮
支持emoji表情
支持上标、下标、下划线、删除线、表格、视频、图片（几乎所有html元素）……
支持typographer字符替换
多主题动态支持
极致的中文排版优化
前后端支持
截图以下截图即demo目录编译的效果
快速上手1. 克隆TOWXML到小程序根目录
git clone https://github.com/sbfkcel/towxml.git
2. 在小程序app.js中引入库
//app.js
const Towxml = require("/towxml/main"); //引入towxml库
App({
onLaunch: function () {
},
towxml:new Towxml() //创建towxml对象，供小程序页面使用
})
3. 在小程序页面文件中引入模版
4. 在小程序对应的js中请求数据
//pages/index.js
const app = getApp();
Page({
data: {
//article将用来存储towxml数据
article:{}
},
onLoad: function () {
const _ts = this;
//请求markdown文件，并转换为内容
wx.request({
url: "http://xxx/doc.md",
header: {
"content-type": "application/x-www-form-urlencoded"
},
success: (res) => {
//将markdown内容转换为towxml数据
let data = app.towxml.toJson(res.data,"markdown");
//设置文档显示主题，默认"light"
data.theme = "dark";
//设置数据
_ts.setData({
article: data
});
}
});
}
})
5. 引入对应的WXSS
/**pages/index.wxss**/ /**基础风格样式**/ @import "/towxml/style/main.wxss"; /**如果页面有动态主题切换，则需要将使用到的样式全部引入**/ /**主题配色（浅色样式）**/ @import "/towxml/style/theme/light.wxss"; /**主题配色（深色样式）**/ @import "/towxml/style/theme/dark.wxss";
OK，大功告成~~
API如果为了追求极致的体验，建议将markdown、html转换为towxml数据的过程放在服务器上，在小程序中直接请求数据即可。
1. 依赖环境
需要 Node.js 环境。（已经安装请忽略）
2. 安装towxml
npm install towxml
3. 接口使用
const Towxml = require("towxml");
const towxml = new Towxml();
//Markdown转WXML
let wxml = towxml.md2wxml("# Article title");
//html转WXML
let wxml = towxml.html2wxml("Article title
");
//Markdown转towxml数据
let data = towxml.toJson("# Article title","markdown");
//htm转towxml数据
let data = towxml.toJson("# Article title");
Demo示例
将towxml/demo添加为小程序工程
再克隆towxml到demo目录
使用小程序开发工具编译即可
LicenseMIT
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/94551.html
摘要：是一个可将转为微信小程序的渲染库。用于解决在微信小程序中不能直接渲染的问题。依赖环境需要环境。已经安装请忽略安装接口使用转转转数据转数据示例将添加为小程序工程再克隆到目录使用小程序开发工具编译即可 Towxml Towxml 是一个可将HTML、Markdown转为微信小程序WXML(WeiXin Markup Language)的渲染库。 用于解决在微信小程序中Markdown、HT...
摘要：本项目由微信小程序开发论坛会员开发原文地址垂直微信小程序开发交流社区加载慢，等等微信小程序富文本解析自定义组件，支持及解析可能是第一个微信小程序富文本解析组件代码库地址示例版使用地址现状版本号目前还不太适合直接使用目前项目不 本项目由微信小程序开发论坛-WeAppDev http://weappdev.com/ 会员开发 原文地址: http://weappdev.com/t/wxp...
摘要：上一篇小程序开发第一篇注册获取同步企业项目数据微信小程序开发者工具下载小程序开发者工具使用小程序原生开发直接使用小程序开发者工具打开项目即可小程序框架开发首选官方提供类开发框架，备选。 上一篇：小程序开发 第一篇：注册、获取unionid同步企业项目数据 1.微信小程序开发者工具 下载：小程序开发者工具 使用： 小程序原生开发：直接使用小程序开发者工具打开项目即可 小程序框架开发：...
阅读 2054·2021-09-27 14:02
阅读 4594·2021-09-27 13:36
阅读 1253·2019-08-30 12:46
阅读 1992·2019-08-30 10:51
阅读 3785·2019-08-29 17:02
阅读 1196·2019-08-29 16:38
阅读 1994·2019-08-29 16:37
阅读 3323·2019-08-26 10:32
