Monaco Editor编辑器教程(二七):集成多个GitLab编辑器颜色样式主题

news2024/11/24 16:53:11

前言

在开发编辑器时,未来满足开发者的审美需求,有时需要设计多套颜色主题,最基础的是黑色主题和白色主题。如果用户愿意出钱的话,可以加上一些其他花里胡哨的颜色主题,在vscode中是可以搜到。今天就来教大家一些,如何借助现成的资源来为自己的monaco编辑器增加丰富的颜色主题。正所谓它山之石,可以攻玉,开源给了我们非常多的好处,让我们能够站在巨人的肩膀上。同时同学们也要记得,喝水不忘挖井人。本篇文件会教大家将GitLab WEB IDE中的编辑器主题集成到自己的编辑器中。

集成过程

在gitlab中,官方提供了一共六种编辑器颜色主题。分别是
Light,Dark,Solarized Light,Solarized Dark,Monokai,None。

效果图如下:在这里插入图片描述

不知道网友们喜欢哪款样式,我个人比较喜欢Solarized Dark 主题。沉稳,冷静。

之前我说过,自定义的主题都是继承官方提供的原始主题进行颜色自定义的。所有有些主题表现和官方的很相似,比如Light,Dark主题,就与官方的vs,vs-dark 很类似。

说了那么多,下面开始正式集成

寻找编辑器主题相关代码

使用关键词 defineTheme 可以很容易找到核心代码,如下图

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

JavaScript控制语句及搭建前端服务器

目录 一、for in 二、for of 三、try catch 四、搭建前端服务器 (1)安装nvm (2)检查npm (3)搭建前端服务器 一、for in 主要用来遍历对象 let father {name:张三, age:18, study:function(){}};f…

Linux常用的网络命令有哪些?快速入门!

在Linux系统中,有许多常用的网络命令可以用来进行网络配置和故障排除。这些命令可以帮助我们了解网络的状态和性能,并且可以快速诊断和解决网络问题。在本文中,我们将介绍一些常用的Linux网络命令,并提供一些案例来帮助您更好地理…

高数基础2

目录 函数的极限: 自变量趋向于有限值时函数的极限 左右极限 需要分左右极限的三种问题: 例题: 极限性质: 函数的保号性: 函数的保号性: 例题: 极限值与无穷小的关系 极限存在准则&#…

FRRoute 路由信息采集 + MPLS VPN隧道信息采集与识别

FRRoute 路由信息采集 MPLS VPN隧道信息采集与识别FRRoute数据库-表路由信息采集命令输出字段 -> 映射到 -> 数据库字段数据结构 算法show int brroute -nshow interfaces loMPLS VPN隧道信息采集与识别step 1 : 采集mpls邻居表step 2 : MPLS 隧道识别FRRoute 数据库-…

RK3568平台开发系列讲解(Linux系统篇)线程 pthread 详解

🚀返回专栏总目录 文章目录 一、POSIX 线程模型二、pthread_create()创建线程三、线程属性3.1、初始化线程对象属性3.2、销毁一个线程属性对象3.3、线程的分离状态3.4、线程的调度策略3.5、线程的优先级3.6、线程栈四、线程退出五、回收已终止线程的资源沉淀、分享、成长,让…

Word处理控件Aspose.Words功能演示:使用C#创建MS Word文档

Aspose.Words是一种高级Word文档处理API,用于执行各种文档管理和操作任务。API支持生成,修改,转换,呈现和打印文档,而无需在跨平台应用程序中直接使用Microsoft Word。 Aspose API支持流行文件格式处理,并…

苹果6信号不好的快速解决方法

许多朋友反馈,苹果6的信号不佳,建议从以下方面查找: 方法一:开启飞行模式后再关闭 有时候手机由于周围环境网络比较差,会导致信号处于无服务状态,这时后我们开启飞行模式后再关闭飞行模式,系统就…

反序列化漏洞及PHP魔法函数

目录 1、漏洞原理 2、序列化(以PHP语言为例) 3、反序列化 4、PHP魔法函数 (1)__wakeup() (2)__destruct() (3)__construct() (4)__toString() &…

Arduino UNO驱动micro SD卡读写模块

目录一、简介二、使用前准备三、测试方法四、实验现象一、简介 Micro SD卡模块TF卡读写卡器板载电平转换电路,即接口电平可为5V或3.3V,支持支持Micro SD卡(≤2G)、Micro SDHC高速卡(≤32G)。供电电源为4.5V~5.5V,板载3.3V稳压电路&#xff0…

甘特图控件DHTMLX Gantt入门使用教程【引入】:dhtmlxGantt与ASP.NET Core(上)

DHTMLX Gantt是用于跨浏览器和跨平台应用程序的功能齐全的Gantt图表。可满足项目管理应用程序的大部分开发需求,具备完善的甘特图图表库,功能强大,价格便宜,提供丰富而灵活的JavaScript API接口,与各种服务器端技术&am…

minio 部署、迁移、使用

一、minio 部署 1、单节点部署 部署IP:192.168.206.10 1.1、下载minio的二进制文件 wget https://dl.min.io/server/minio/release/linux-amd64/minio 1.2、规划磁盘 minio 数据目录一定不能和 跟/ 在一个磁盘上,要单独挂载,比如规划将m…

一文看懂SpringBoot操纵数据库

1.前言 很多同学进入公司就开始参与项目开发,大多数情况是对某个项目进行维护或者需求迭代,能够从0到1参与到项目中的机会很少,因此并没有多少机会了解某些技术的运行机制。换句话说,有的面试官在面试的时候就会探讨深层的技术问题…

【产品设计】那些被迫妥协的产品设计背后的技术原因

刚入门的产品经理经常会听到前辈们说应该懂点技术,却不明白为什么。本文作者分享了几个被迫妥协的产品设计的例子,希望能让不是技术出身的产品经理了解到“产品经理应该懂点技术”在产品设计中有什么指导意义,一起来看一下吧。 刚入门的产品经…

学习C++:C++进阶(六)如何在C++代码中调用python类,实例化python中类的对象,如何将conda中的深度学习环境导入C++项目中

目录 1.应用场景 2.场景:利用maskrcnn深度学习网络实现语义分割 3.CMake配置python解释器 4.C中实现实例化python中的类的对象并调用类内方法 4.1 初始化python环境 4.2 实例化python类的对象 1.应用场景 我们在视觉SLAM以及目标检测和识别中,经常…

AMD GPU安装运行stable diffusion

本文操作环境为Windows10/11AMD AI绘画是一种利用人工智能技术进行绘画的方法。它可以通过机器学习算法来学习艺术家的风格,并生成类似于艺术家的作品。最近,AI绘画技术得到了很大的发展,许多公司和研究机构都在进行相关的研究和开发。例如&…

华为电脑录屏功能在哪?这样做,您可以快速找到

案例:如何在华为电脑上找到电脑录屏功能? “听说电脑有录屏功能,但我在我的华为电脑上找了很久,都没有找到。难道华为电脑没有录屏功能吗?有没有小伙伴可以告诉我华为电脑录屏功能在哪?孩子已经快绝望了&a…

第六章 法律体系

目录 第一节 法律体系与法律部门的概念 一、法律体系的概念 (一)法律体系的含义和特征 (二)法律体系与相关概念的区别(法律体系与国家,现行有关) (三)法律体系的形成和…

本地存储、自定义事件、全局事件总线、消息订阅与发布【Vue】

Vue 1.1 浏览器的本地存储 存储内容大小一般支持5MB左右(不同浏览器可能还不一样)浏览器通过 Window.sessionStorage 和 Window.localStorage 属性来实现本地存储机制相关API: (1)xxxxStorage.setItem(key, value); 该方法接受一…

CT前瞻(三):Adobe系列XD软件绘制简单的原型图与交互设计

文章目录📋前言🎯关于原型图绘制🎯XD绘制原型图与交互设计🎯关于XD软件其他功能📝最后📋前言 Adobe XD是一个协作式易用平台,可帮助团队为网站、移动应用程序、语音界面、游戏等创建设计。还可…

每个 Android 开发者都应该知道的有用资源

每个 Android 开发者都应该知道的有用资源 在本文中,我将提到 7 个资源,这些资源对于 Android 开发人员来说非常有益。我亲自使用过其中的每一个几次。他们无数次派上用场。确保您不要忘记为这些资源添加书签/收藏,以便您可以在需要使用它们时…