我们常见在一些博客网站看到源码展示，供读者研读、复制。但是如果代码像在代码编辑器里面一样对标签、变量...进行上色，那就大大提高可阅读性，读者浏览起来也相对舒适。
Prismjs就是一款在前端界面显示代码语法高亮的npm包；它实现了代码在前端页面显示时就像在编辑器中时一样的样式。
它支持 201种语言 的代码高亮
再来看看效果是不是符合口味（以Html为例）
DEFAULT
DARK
FUNKY
OKAIDIA
TWILIGHT
COY
SOLARIZED LIGHT
TOMORROW NIGHT
使用
一、引入依赖
npm i --save prismjs
npm i --save babel-plugin-prismjs
二、main.js文件中使用
import Prism from "prismjs";
三、.babelrc文件plugins中添加配置
["prismjs", {
"languages": ["javascript", "css", "markup", "html"],//语言
"plugins": ["line-numbers"],//行号插件（可以不用，还有其他插件网上查询）
"theme": "tomorrow", //主题coy|twillight|tomorrow|solarizedlight|okaidia|funky|dark
"css": true
}
]
四、在有代码要高亮渲染的页面执行代码高亮方法
mounted() {
Prism.highlightAll();//代码高亮渲染函数
},
注：
Prism.highlightAll()可以直接在main.js中执行。但是单页面应用中页面发现高亮渲染只执行了一次，效果就是第一次打开的页面中代码有高亮，换其他页就没有。
于是就把高亮函数放在了mounted周期中执行。这样每个页面打开都会渲染一遍。
