C3 Monaco Custom Syntax Highlighting - construct.net

25/2/2025, 17:02:33

Tính đến 25-02-2025. Xem phiên bản mới nhất.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

Bạn sẽ cần cài đặt một tiện ích mở rộng như Tampermonkey hoặc Violentmonkey để cài đặt kịch bản này.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(Tôi đã có Trình quản lý tập lệnh người dùng, hãy cài đặt nó!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

Tác giả
Clovelt
Đánh giá
0 0 0
Phiên bản
1.0
Đã tạo
25-02-2025
Đã cập nhật
25-02-2025
Kích thước
4 KB
Giấy phép
MIT
Áp dụng cho

Adds a custom syntax highlight to Construct 3's Monaco integration, substituting the .js syntax.

This is experimental and uses non-documented stuff! Beware! But it works 🙂

https://monaco-editor-extend-lang-conf.vercel.app/readme.html
Using this workaround, I inject a custom style into Monaco which is made with Monarch, a syntax editor:

https://microsoft.github.io/monaco-editor/monarch.html
It replaces the JS syntax with whatever custom one we want, in my case I want my dialog system to have each element highlighted how I want (for example comments are all lines that start with ":")


const monaco = MonacoEnvironment.monaco;
In construct, I saw this is the way to access Monaco.


const waitForMonaco = setInterval(() => {
if (typeof MonacoEnvironment !== 'undefined' && MonacoEnvironment.monaco) {
clearInterval(waitForMonaco); // Stop checking once Monaco is ready
I also constantly check if Monaco enviroment is present, as Construct only loads it once you open the code editor.


Other than that, rest of the logic is similar to the article linked 🙂

Biggest reason to do this for me was that accents were being tinted red for some reason, but I added a lot of custom stuff too in the process