用于微信小程序的HTML和Markdown格式的富文本渲染组件，支持代码高亮

网友投稿 1292 2022-10-17 10:49:00

用于微信小程序的HTML和Markdown格式的富文本渲染组件，支持代码高亮

html2wxml微信小程序富文本组件

效果

参考

小程序富文本解析 https://github.com/icindy/wxParse

PHP移植版highlight.js https://github.com/scrivo/highlight.php

PHP编写的Markdown解析器 https://github.com/erusev/parsedown

演示

扫码打开演示小程序

小程序端用法

三种版本演示

三种版本演示所用的小程序源码均在demo目录中

插件版本准备

组件版本准备

模板版本准备

组件使用方法（仅适用于插件版本和组件版本）

属性介绍

示例

// 将Page中的content数据作为HTML格式渲染// 禁用代码高亮功能// 禁用代码行号显示功能// 代码高亮样式改为tomorrow// 设置代码高亮检测语言 (最多6个，自行搭建服务不受限制)// 对HTML数据中的img标签的相对路径补全域名// 禁用加载中动画// 将Page中的text数据作为Markdown格式渲染// 直接渲染Page中的已经过解析的obj数据

服务端用法

富文本的解析默认是由QwqOffice完成，存在不稳定因素，你可以自行搭建解析服务或将解析组件引入到你的项目中。

复制整个 html2wxml-php 文件夹到项目目录中引入类文件class.ToWXML.php include( 'path/to/html2wxml-php/class.ToWXML.php' ); 实例化html2wxml，进行解析并输出，示例： $towxml = new ToWXML(); $json = $towxml->towxml( '

H1标题

', array( 'type' => 'html', 'highlight' => true, 'linenums' => true, 'imghost' => null, 'encode' => false, 'highlight_languages' => array( 'html', 'js', 'php', 'css' ) ) ); echo json_encode( $json, JSON_UNESCAPED_UNICODE );

参数介绍

参数名	类型	默认值	说明
text	String	要渲染的HTML或Markdown文本
args	Array	[]	附加参数

args 参数介绍

参数名	类型	默认值	说明
type	String	html	要渲染的文本类型，可用值`html`,`markdown`,`md`
highlight	Boolean	true	是否对`pre`内文本进行代码高亮
highlight_languages	Array	['html', 'js', 'css', 'php']	`pre`代码高亮检测语言。查看可用语言
linenums	Boolean	true	是否为`pre`添加行号显示
imghost	String	null	对`img`标签中`src`属性可能的相对路径进行域名补全
encode	Boolean	true	是否对结果进行JSON编码

可用的代码高亮语言

语言名称和别名均可使用

语言名称	别名
1c
abnf
accesslog
actionscript	as
ada
apache	apacheconf
applescript	osascript
arduino
armasm	arm
asciidoc	adoc
aspectj
autohotkey	ahk
autoit
avrasm
awk
axapta
bash	sh,zsh
basic
bnf
brainfuck	bf
cal
capnproto	capnp
ceylon
clean	clean,icl,dcl
clojure-repl
clojure	clj
cmake	cmake.in
coffeescript	coffee,cson,iced
coq
cos	cos,cls
cpp	c,cc,h,c++,h++,hpp
crmsh	crm,pcmk
crystal	cr
cs	csharp
csp
css
d
dart
delphi	dpr,dfm,pas,pascal,freepascal,lazarus,lpr,lfm
diff	patch
django	jinja
dns	bind,zone
dockerfile	docker
dos	bat,cmd
dsconfig
dts
dust	dst
ebnf
elixir
elm
erb
erlang-repl
erlang	erl
excel	xlsx,xls
fix
flix
fortran	f90,f95
fsharp	fs
gams	gms
gauss	gss
gcode	nc
gherkin	feature
glsl
go	golang
golo
gradle
groovy
haml
handlebars	hbs,html.hbs,html.handlebars
haskell	hs
haxe	hx
hsp
htmlbars
http	https
hy	hylang
inform7	i7
ini	toml
irpf90
java	jsp
javascript	js,jsx
jboss-cli	wildfly-cli
json
julia-repl
julia
kotlin
lasso	ls,lassoscript
ldif
leaf
less
lisp
livecodeserver
livescript	ls
llvm
lsl
lua
makefile	mk,mak
markdown	md,mkdown,mkd
mathematica	mma
matlab
maxima
mel
mercury	m,moo
mipsasm	mips
mizar
mojolicious
monkey
moonscript	moon
n1ql
nginx	nginxconf
nimrod	nim
nix	nixos
nsis
objectivec	mm,objc,obj-c
ocaml	ml
openscad	scad
oxygene
parser3
perl	pl,pm
pf	pf.conf
php	php3,php4,php5,php6
pony
powershell	ps
processing
profile
prolog
protobuf
puppet	pp
purebasic	pb,pbi
python	py,gyp
q	k,kdb
qml	qt
r
rib
roboconf	graph,instances
routeros	routeros,mikrotik
rsl
ruby	rb,gemspec,podspec,thor,irb
ruleslanguage
rust	rs
scala
scheme
scilab	sci
scss
shell	console
smali	smali
smalltalk	st
sml	ml
sqf	sqf
sql
stan
stata	do,ado
step21	p21,step,stp
stylus	styl
subunit
swift
taggerscript
tap
tcl	tk
tex
thrift
tp
twig	craftcms
typescript	ts
vala
vbnet	vb
vbscript-html
vbscript	vbs
verilog	v,sv,svh
vhdl
vim
x86asm
xl	tao
xml	html,xhtml,rss,atom,xjb,xsd,xsl,plist
xquery	xpath,xq
yaml	yml,YAML,yaml
zephir	zep