一、克隆Towxml项目
git clone https://github.com/sbfkcel/towxml.git
二、配置功能特性
- 删除不需要的echarts支持
三、安装项目依赖
cd towxml npm install
四、打包
npm run build
五、集成进 Taro项目
- 将打包生成的dist目录重命名为
towxml复制到Taro项目的微信dist目录下
- 将打包生成的dist目录重命名为
towxml再次复制到Taro项目的根目录下（这样项目不会报错）
- 集成代码如下
...your import... import towxml from '../../../towxml' interface DimensionWritingProps { } export default function DimensionWriting(props: FC<DimensionWritingProps>) { ...your logic // towxml data const [dataTowxml, setDataTowxml] = useState({}) const router = useRouter() useEffect(() => { if(dataDimensionWriting.content.length >0 ) { let result = towxml(dataDimensionWriting.content[0].base_dimension.content,'markdown',{ }) setDataTowxml(result) setIsReady(true) } },[dataDimensionWriting.content.length]) if (!isReady) return null return <View className='dimension-writing'> <BNavTopV2 title={"文章锦集"}/> <View className={'article'}> <View className={'header'}>{dataDimensionWriting.content[0].base_dimension.name}</View> <View className={'section'}> { // @ts-ignore <towxml nodes={dataTowxml}/> } </View> </View> </View> } DimensionWriting.defaultProps = {}
- 集成代码配置如下
export default { navigationStyle: "custom", enableShareAppMessage:true, enableShareTimeline: true, usingComponents: { towxml: '../../towxml/towxml', }, }
六、最终效果
ok，已完成
