最近在做项目时遇到的，有一个功能返回是一个xml文本，需要很友好的显示在html中。

前端的框架是vue。

调研了一些格式化xml的网站找到了答案，发现了两个很好的库：vkbeautify & vue-highlightjs，前者主要是用来格式化xml，后者是将code里的xml都加上标签，这样我们就可以很轻易的通过样式来控制标签的颜色、粗细等样式了。

npm install vkbeautify --save

npm i vue-highlight.js --save

基本使用方法：

vkbeautify：

import vkbeautify from 'vkbeautify'

vkbeautify.xml(xml)  直接运行即可，括号中xml就是你的xml文本

vue-highlightjs

首先要在main.js

import VueHighlightJS from 'vue-highlightjs'

Vue.use(VueHighlightJS);

模板中

最后别忘记引入样式，或者自己按照官方示例改都可以