【element-tiptap】如何增加一个扩展项,为文字渲染颜色?

源码地址:
https://github.com/Leecason/element-tiptap
可以看到,当前这个页面的文字,都是黑色的(除了链接)
在这里插入图片描述
酱紫有些单调,我喜欢五颜六色的。那么这篇文章就来看下菜单项里面如何增加一个颜色的扩展,可以为文字修改颜色🥗🥗🥗
文本颜色呢,就不用自己开发扩展了,tiptap 有提供现成的扩展
https://tiptap.dev/docs/editor/extensions/functionality/color

扩展列表都可以在这个文档里面找到,根据文档的说明,分为两个步骤,非常的简单方便快速

  • 安装依赖
npm install @tiptap/extension-text-style @tiptap/extension-color
  • 在扩展列表中增加一项
Color.configure({types: ['textStyle'],
})

就是demos/views/Simple.vue 这个文件的 extensions 数组中增加 Color
然后就可以看到啦!
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/443686.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

k8s微服务

一 、什么是微服务 用控制器来完成集群的工作负载,那么应用如何暴漏出去?需要通过微服务暴漏出去后才能被访问 Service是一组提供相同服务的Pod对外开放的接口。 借助Service,应用可以实现服务发现和负载均衡。 service默认只支持4层负载均…

Springboot 整合 logback 日志框架

文章目录 整合 Logback 日志框架第一步:导入依赖第二步:导入配置(logback.xml)详解 使用(记录日志) 遇到问题一解决方案 整合 Logback 日志框架 第一步:导入依赖 (Springboot 会自己…

Squid + Stunnel 配置

环境: 亚马逊服务器一台:3.26.80.132 华为云服务器一台:122.59.52.68 客户机一台: Win11 实现的需求:客户机通过设置华为云代理,实现透过亚马逊服务器上网 一、亚马逊服务器 1、安装Squid https://bl…

python爬虫 - 深入requests模块

🌈个人主页:https://blog.csdn.net/2401_86688088?typeblog 🔥 系列专栏:https://blog.csdn.net/2401_86688088/category_12797772.html 目录 前言 一、下载网络文件 (一)基本步骤 (二&…

大模型部署-​Ollama+WebUI

Ollama(安装包和安装文档文末领取!) Ollama 简介 主要特点: 易于使用:它提供了一个简洁的界面和命令行工具,使得用户可以方便地管理和运行不同的大语言模型。 多种模型支持:可以运行多种开源…

介绍一款开源的 Modern GUI PySide6 / PyQt6的使用

首先附上大神的开源地址(自行克隆吧): https://github.com/Wanderson-Magalhaes/Modern_GUI_PyDracula_PySide6_or_PyQt6 步骤一:安装PySide6库 pip install PySide6 步骤二:运行main文件 python main.py 就得…

Windows 11 24H2版本有哪些新功能_Windows 11 24H2十四大新功能介绍

距离上次发布的23H2版本已经过去了一年时间,现在,Win 11的24H2版本终于等到了,微软已经全面公开发布Win11 24H2版本,版本号为26100.1742,此次官宣的版本包括了消费者版、商业版、LTSC 2024版等,各种语言版本…

python使用装饰器来统计函数被调用次数、格式化dict以及Python-smtplib邮件发送的IP name possibly forged问题解决

一、python调试:使用装饰器来统计函数被调用次数及格式化dict 喜欢调试的时候显示数据并显示一些其它的信息,比如区分是哪次调用的调试信息,比如友好的显示dict等相对复杂的数据类型,所以这里涉及到两个方面。一是统计函数被调用次…

【计算机网络】网络相关技术介绍

文章目录 NAT概述NAT的基本概念NAT的工作原理1. **基本NAT(静态NAT)**2. **动态NAT**3. **NAPT(网络地址端口转换,也称为PAT)** 底层实现原理1. **数据包处理**2. **转换表**3. **超时机制** NAT的优点NAT的缺点总结 P…

大模型微调十诫:关于将微调模型部署到生产环境的十条建议

转自NLP工程化 大模型微调十诫:关于将微调模型部署到生产环境的十条建议: (1)不要盲目微调模型,先尝试使用提示的方式满足需求。只有当提示无法达到质量、性能或成本目标时,才考虑微调。 (2&…

RabbitMQ延迟队列

1场景: 1.下单之后,给10分钟时间进行支付,如果10分钟后,没有支付,订单取消。(可以使用队列的ttl,因为所有的消息都是一样的停留时长10分钟) 2.定时发布文章(要求4月1号…

MPA-SVM多变量分类预测|海洋捕食者优化算法-支持向量机|Matalb

目录 一、程序及算法内容介绍: 基本内容: 亮点与优势: 二、实际运行效果: 三、算法介绍: 四、完整程序下载: 一、程序及算法内容介绍: 基本内容: 本代码基于Matlab平台编译&…

JavaScript 数组简单学习

目录 1. 数组 1.1 介绍 1.2 基本使用 1.2.1 声明语法 1.2.2 取值语法 1.2.3 术语 1.3 案例 1. 数组 1.1 介绍 1.2 基本使用 1.2.1 声明语法 1.2.2 取值语法 1.2.3 术语 1.3 案例

基于java+springboot的旅游信息网站、旅游景区门票管理系统设计与实现

该系统是基于javaspringboot开发的旅游景区门票管理系统。是给师弟开发的大四实习作品。学习过程中,遇到问题可以咨询github作者。 演示地址 前台地址: http://travel.gitapp.cn 后台地址: http://travel.gitapp.cn/admin 后台管理帐号&am…

植物大战僵尸修改器-MFC

创建项目 创建mfc应用 基于对话框 打开资源视图下的 IDD_MFCAPPLICTION2_DIALOG 限制对话框大小 将属性中Border的值改为对话框外框 删除对话框中原有的控件 属性-外观-Caption 设置对话框标题 工具箱中拖放一个按钮 修改按钮名称 将按钮ID改为IDC_COURSE 在MFCApplication2…

Fiddler配合wireshark解密ssl

环境: win11(wireshark)--虚拟机win7(Fiddler)---虚拟机win7(HTTPS站点) 软件安装问题: 需要.net环境,NDP461-KB3102436-x86-x64-AllOS-ENU.exe。 安装fiddler后安装下…

Golang通用代码生成器:仙童,电音仙女尝鲜版十二,为售前准备的哑数据模式

Golang通用代码生成器:仙童,电音仙女尝鲜版十二,为售前准备的哑数据模式 哑数据模式是一种使用内存数据的为快速原型准备的模式。专门为售前,产品经理和项目经理准备。Golang通用代码生成器支持此种模式,请见视频:https://www.bi…

【Qt+Python项目构建】- 02 Qt creator 14.0 + PySide6 如何让图像控件的尺寸变化和窗口一致

前言:【这是个AI不会回答的问题】 Qt Creator 新的版本又发出了,Pyside6 有很多新功能。但是,一些传统的方法要被淘汰了。 一个经典的例子是: 我有个一个图像要显示在Form里面的图像控件上,OK, 我现在拖…

HarmonyOs 查看官方文档使用弹窗

1. 学会查看官方文档 HarmonyOS跟上网上的视频学习一段时间后,基本也就入门了,但是有一些操作网上没有找到合适教学的视频,这时,大家就需要养成参考官方文档的习惯了,因为官方的开发文档是我们学习深度任何一门语言或…

AI资深导师指导-ChatGPT深度科研工作应用、论文撰写、数据分析及机器学习与AI绘图

2022年11月30日,可能将成为一个改变人类历史的日子——美国人工智能开发机构OpenAI推出了聊天机器人ChatGPT3.5,将人工智能的发展推向了一个新的高度。2023年4月,更强版本的ChatGPT4.0上线,文本、语音、图像等多模态交互方式使其在…