当前位置:首页 > 技术分析 > 正文内容

一款轻量语法高亮插件——Prism.js

ruisui881个月前 (03-27)技术分析20

Prism 是一款轻量级、可扩展的语法高亮插件,在构建时考虑了现代 Web 标准。它被用于数百万个网站,包括您每天访问的一些网站。

地址: https://prismjs.com/


安装使用方法:

$ npm install prismjs

然后你可以import进入你的包:

import Prism from 'prismjs';


<script src="prism.js" data-manual></script>

或者

<script>
window.Prism = window.Prism || {};
window.Prism.manual = true;
</script>
<script src="prism.js"></script>


使用方法:

p { color: red }
p { color: red }


高亮插件主要可以让

标签里面的代码高亮, 就跟编辑器里显示的一样, 有利于阅读, 有利于用户体验, 常用的highlight.js, 这里要说的是更加轻量的选择——Prism.js

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/3083.html

标签: 高亮插件
分享给朋友:

“一款轻量语法高亮插件——Prism.js” 的相关文章

机动车检测站收费管理系统

机动车检测站收费管理系统headerfooter《机动车检测站收费管理系统》是一款适用于中小型机动车检测站收费管理、打印票据。主要包括收费打印、统计查询、辅助字典等功能。本管理系统多处具有快速辅助录入功能,操作简单,易学、易用;处理功能高效强大,是协助您的好帮手!主要功能:1.收费管理:收费打印、今...

高效使用 Vim 编辑器的 10 个技巧

在 Reverb,我们使用 MacVim 来标准化开发环境,使配对更容易,并提高效率。当我开始使用 Reverb 时,我以前从未使用过 Vim。我花了几个星期才开始感到舒服,但如果没有这样的提示,可能需要几个月的时间。这里有十个技巧可以帮助你在学习使用 Vim 时提高效率。1. 通过提高按键重复率来...

佳能 EOS R8 深度评测

佳能 EOS R8 的定位是入门级全画幅无反光镜可换镜头相机。尽管在产品阵容中处于这一位置,R8 仍然是一个强大的相机,配备了先进的 R6 II 同款成像传感器、快速处理器和令人难以置信的自动对焦系统,体积小、重量轻、价格低。这款相机是发烧友、旅行者、家庭以及任何想要全画幅传感器相机的人的绝佳选择。...

vue打开新窗口并且实现传参,有图有真相

我要实现的功能是打开一个新窗口用来展示新页面,而且需要传参数,并且参数不能显示在地址栏里面,而且当我刷新页面的时候,传过来的参数不能丢失,要一直存在,除非我手动关闭这个新窗口,即浏览器的标签页。通过面向百度编程,发现网上的根本达不到这个效果,而且还都是坑,明明实现不了,还若有其事的写出来,于是我在标...

三勾商城(java+vue3)微信小程序商城+SAAS+前后端源码

项目介绍本系统功能包括: 前台展示+后台管理+SAAS管理端,包括最基本的用户登录注册,下单, 购物车,购买,结算,订单查询,收货地址,后台商品管 理,订单管理,用户管理等等功能,小伙伴一起来看看吧。三勾小程序商城基于springboot+element-ui+uniapp打造的面向开发的小程序商城...

vue.js 双向绑定如何理解,有什么好处!#云南小程序开发

Vue.js 的双向数据绑定是借助于 JavaScript 的一些特性,如对象的属性 getter 和 setter 以及 Vue 的依赖追踪系统实现的。简单来说,双向数据绑定就是数据与视图间的双向通信,也就是说数据的改变会马上反映到视图中,视图的改变也会立刻改变数据。具体来说,当你改变了数据时,视...