uniapp 使用towxml

Towxml 是一个可将HTML、Markdown转为微信小程序WXML(WeiXin Markup Language)的渲染库。用于解决在微信小程序中Markdown、HTML不能直接渲染的问题。

  1. 克隆项目到本地
bash 复制代码
git clone https://github.com/sbfkcel/towxml.git
  1. 构建依赖
bash 复制代码
npm install
  1. 本地打包
bash 复制代码
npm run build
  1. 拷贝dist到项目中,重命名

  2. 修改 decode.json

    路径修改为相对路径

javascript 复制代码
{
  "component": true,
  "usingComponents": {
    "decode": "./decode",
    "audio-player": "./audio-player/audio-player",
    "echarts": "./echarts/echarts",
    "latex": "./latex/latex",
    "table": "./table/table",
    "todogroup": "./todogroup/todogroup",
    "yuml": "./yuml/yuml",
    "img": "./img/img"
  }
}

使用

pages.json 中进行组件注册

如果单个页面使用

javascript 复制代码
{
	"pages": [

		{
			"path": "pages/detail/detail",
			"style": {
				"navigationBarTitleText": "详情",
				"disableScroll": true,
				"app-plus": {
					"softinputMode": "adjustResize"
				},
				// 如果是单个页面使用
				// #ifdef APP-PLUS || H5 || MP-WEIXIN || MP-QQ
				// "usingComponents": {
					// "towxml": "/wxcomponents/towxml/towxml"
				// }
				// #endif
			}
		},
	],
	"globalStyle": {
		"navigationBarTextStyle": "black",
		"navigationBarTitleText": "uni-app",
		"navigationBarBackgroundColor": "#F8F8F8",
		"backgroundColor": "#F8F8F8",
		// 如果是组件使用
		// #ifdef APP-PLUS || H5 || MP-WEIXIN || MP-QQ
		"usingComponents": {
			"towxml": "/wxcomponents/towxml/towxml"
		}
		// #endif
	},
	"uniIdRouter": {}
}
相关推荐
Nan_Shu_61414 小时前
学习:uniapp全栈微信小程序vue3后台-额外/精彩报错篇
前端·学习·微信小程序·小程序·uni-app·notepad++
卷Java18 小时前
小程序前端功能更新说明
java·前端·spring boot·微信小程序·小程序·uni-app
卷Java18 小时前
小程序原生导航栏返回键实现
spring boot·云原生·微信小程序·uni-app
2501_915918411 天前
Video over HTTPS,视频流(HLSDASH)在 HTTPS 下的调试与抓包实战
网络协议·http·ios·小程序·https·uni-app·iphone
鱼樱前端1 天前
uni-app快速入门章法(一)
前端·uni-app
Q_Q5110082851 天前
python+springboot+uniapp基于微信小程序的任务打卡系统
spring boot·python·django·flask·uni-app·node.js·php
李慕婉学姐1 天前
【开题答辩过程】以《基于SpringBoot+Vue+uni-app的智慧校园服务系统的设计与实现》为例,不会开题答辩的可以进来看看
spring boot·uni-app
withoutfear1 天前
uni-app 开发H5软键盘会顶起底部内容的解决方案
uni-app·软键盘
影子信息1 天前
uniapp 日历组件 uni-datetime-picker
前端·uni-app