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

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

ruisui883个月前 (03-27)技术分析45

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” 的相关文章

Git分布式系统---Gitlab多人工作流程

前言在上一次推文中,我们已经很清楚的讲解了如何创建本地仓库、提交(push)项目到远程仓库以及从远程仓库clone(克隆)项目到本地的相关操作。大家可以先去看前面的推文(快速掌握Git分布式系统操作)点击查看目前无论你是否步入社会还是在校学生,都会使用Gitlab来进行团队的代码管理。(可以这样说:...

一次Java内存占用高的排查案例,解释了我对内存问题的所有疑问

问题现象7月25号,我们一服务的内存占用较高,约13G,容器总内存16G,占用约85%,触发了内存报警(阈值85%),而我们是按容器内存60%(9.6G)的比例配置的JVM堆内存。看了下其它服务,同样的堆内存配置,它们内存占用约70%~79%,此服务比其它服务内存占用稍大。那为什么此服务内存占用稍大...

Vue学习笔记之动态路由的参数传递应用及技巧

路由的参数传递:①通过params的类型· 配置路由格式:/router/:id· 传递的方式:在path后面跟上对应的值· 传递后形成的路径:/router/list,/router/profile这个就是前两篇中提到的"动态路由"中有应用过这个方法:②通过query的类型(对象方...

分享15个基于Vue3.0全家桶的优秀开源项目

大家好,我是 Echa。今天来分享 15 个基于 Vue3.0 全家桶的优秀开源项目!1. Vue Admin Bettergithub : https://github.com/chuzhixin/vue-admin-bettervue admin better 对比其他来源 admin 框架有如...

uni-app基于vue开发小程序与标准vue开发新增点

1、路由跳转传参uni.navigateTo({ url: `/pages/transition/spreadTextAction?t=${this.options.t}&rt=${this.options.rt}&l=${this.options.l}`});uni.navigateBack({...

thinkphp8+vue3微信小程序商城,发布公众号App+SAAS+多商户

项目介绍三勾小程序商城基于thinkphp8+vue3+element-ui+uniapp打造的面向开发的小程序商城,方便二次开发或直接使用,可发布到多端,包括微信小程序、微信公众号、QQ小程序、支付宝小程序、字节跳动小程序、百度小程序、android端、ios端。支持主题色+自定义头部导航+自定义...