Monaco Editor Contributing / Dev Setup

最新推荐文章于 2024-09-26 10:39:24 发布

weixin_45780509

最新推荐文章于 2024-09-26 10:39:24 发布

阅读量94

点赞数

文章标签： npm vscode webpack

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/weixin_45780509/article/details/130177749

版权

本文档详细介绍了如何参与Monaco Editor的开发和贡献，包括源代码结构、新增语言支持、核心编辑器和语言支持的调试、运行测试、本地运行网站以及输出文件夹的维护等。

摘要由CSDN通过智能技术生成

Contributing / Dev Setup

Source Code Structure

It is important to understand that the Monaco Editor Core is built directly from the VS Code source code.
The Monaco Editor then enhances the Monaco Editor Core with some basic language features.

This diagram describes the relationships between the repositories and the npm packages:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0xwFAM8q-1681576019932)(./docs/code-structure.dio.svg)]

By default, monaco-editor-core is installed from npm (through the initial npm install), so you can work on Monaco Editor language features without having to build the core editor / VS Code.
The nightly builds build a fresh version of monaco-editor-core from the main branch of VS Code.
For a stable release, the commit specified in vscodeRef in package.json specifies the commit of VS Code that is used to build monaco-editor-core.

Contributing a new tokenizer / a new language

Please understand that we only bundle languages with the monaco editor that have a significant relevance (for example, those that have an article in Wikipedia).

create $/src/basic-languages/{myLang}/{myLang}.contribution.ts
create $/src/basic-languages/{myLang}/{myLang}.ts<

最低0.47元/天解锁文章

weixin_45780509

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

weixin_45780509 CSDN认证博客专家 CSDN认证企业博客

码龄5年

44: 原创

123万+: 周排名

160万+: 总排名

5358: 访问

: 等级

440: 积分

1: 粉丝

0: 获赞

6: 评论

2: 收藏

私信

关注

热门文章

最新评论

thingsboard Widget Library
CSDN-Ada助手: 非常感谢您的第二篇博客！看到这个标题，我就知道这篇文章会很有价值。您的摘要虽然简短，但是让我感受到了您的专业精神和对事物的全面了解。希望您可以继续写下去，分享更多有价值的知识和经验。除了您提到的Thingsboard Widget Library，我认为还有一些相关的知识和技能可以补充。例如，了解基于Web的可视化工具和框架，如D3.js、React和Angular等，可以帮助您更好地开发自定义的Thingsboard小部件。此外，了解物联网数据分析和可视化的基本概念，如数据挖掘、机器学习和大数据分析等，也有助于您更好地理解Thingsboard Widget Library的应用。谢谢您的分享！期待您的下一篇博客。如何写出更高质量的博客，请看该博主的分享：https://blog.csdn.net/lmy_520/article/details/128686434?utm_source=csdn_ai_ada_blog_reply2 如果您持续创作，完成第三篇博客，并且质量分达到 80 分以上，在评论区就有机会获得红包奖励哦！
thingsboard widget action
CSDN-Ada助手: 恭喜您又写了一篇关于Thingsboard widget action的博客，内容非常有趣。您对这个话题的深入探讨让我受益匪浅。下一步，或许您可以考虑分享一些自己的经验，或者提供一些实用的技巧，这样可以更好地帮助读者更好地理解和应用这个主题。感谢您的分享，期待您更多的精彩作品。 CSDN 正在通过评论红包奖励优秀博客，请看红包流：https://bbs.csdn.net/?type=4&header=0&utm_source=csdn_ai_ada_blog_reply3，我们会奖励持续创作和学习的博主，请看：https://bbs.csdn.net/forums/csdnnews?typeId=116148&utm_source=csdn_ai_ada_blog_reply3
ThingsBoard Entities Table widget
CSDN-Ada助手: 非常感谢用户的第四篇博客，介绍了ThingsBoard Entities Table widget。看到用户持续创作，真的非常值得祝贺！希望用户能够继续分享更多关于ThingsBoard的知识和经验，比如可以结合具体的案例来介绍，或者深入探讨一些高级应用。期待用户的下一篇博客！ CSDN 会根据你创作的前四篇博客的质量，给予优秀的博主博客红包奖励。请关注 https://bbs.csdn.net/forums/csdnnews?typeId=116148&utm_source=csdn_ai_ada_blog_reply4 看奖励名单。
FlowForge File Storage
CSDN-Ada助手: 恭喜你，获得了 2023 博客之星评选的入围资格，请看这个帖子（https://bbs.csdn.net/topics/614962616?utmsource=blogger_star_comment）。请在这里提供反馈： https://blogdev.blog.csdn.net/article/details/129986459?utmsource=blogger_star_comment。
Monaco Language Client & VSCode WebSocket Json RPC
CSDN-Ada助手: 介绍与使用指南” Monaco Language Client 是一款基于 VS Code 和 Monaco Editor 的语言客户端工具，它可以帮助开发者更方便地在自己的应用程序中集成语言服务。本文将介绍 Monaco Language Client 的基础知识以及使用指南，帮助大家更好地使用该工具。一、Monaco Language Client 简介 Monaco Language Client 由微软推出，旨在提高开发者的编程效率。它是一个基于语言服务器协议（Language Server Protocol，简称 LSP）的客户端工具，可以在 VS Code 和 Monaco Editor 中使用，支持多种语言（如 C#、TypeScript、JavaScript 等），并且可以扩展到其他语言。二、使用指南 1. 安装 Monaco Language Client Monaco Language Client 可以通过 npm 安装，使用以下命令： npm install monaco-languageclient 2. 配置 Monaco Language Client 首先，需要通过 LSP 来实现与 Monaco Editor 的交互。因此，需要在代码中引入 LSP，使用以下命令： import * as lsp from 'vscode-languageserver'; 其次，需要创建一个 LSP 客户端实例，使用以下代码： import { createConnection, TextDocuments } from 'vscode-languageserver'; const connection = createConnection(); const documents = new TextDocuments(); connection.listen(); 最后，需要注册该客户端支持的语言，使用以下命令： connection.onInitialize(() => { return { capabilities: { textDocumentSync: documents.syncKind, completionProvider: { resolveProvider: true, triggerCharacters: ['.'] } } }; }); 3. 使用 Monaco Language Client 在代码中使用 Monaco Language Client 很简单，只需要按照以下步骤即可： 1. 创建 Monaco Editor 实例： const editor = monaco.editor.create(document.getElementById('container'), { value: '', language: 'typescript' }); 2. 将 Monaco Editor 与 LSP 客户端连接起来： const languageClient = new MonacoLanguageClient({ name: 'Monaco Language Client', clientOptions: { documentSelector: ['typescript'], synchronize: { configurationSection: 'monaco', fileEvents: documents } } }); languageClient.start(); 3. 在 Monaco Editor 中使用 LSP 功能： editor.addAction({ id: 'myAction', label: 'My Action', run: () => { languageClient.sendRequest('myRequest', {}).then((response) => { console.log(response); }); } }); 以上就是使用 Monaco Language Client 的基本步骤，通过这些步骤，我们可以在自己的应用程序中快速集成语言服务，提高开发效率。推荐【每天值得看】：https://bbs.csdn.net/forums/csdnnews?typeId=21804&utm_source=csdn_ai_ada_blog_reply1

大家在看

最新文章

目录

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。