Questions tagged [monaco-editor]
Monaco Editor is the JavaScript based text editing portion of VSCode extracted out into standalone library.
1,015
questions
0
votes
0
answers
8
views
Themes don't look like in example monaco-react
I selected theme from this list https://monaco-react.surenatoyan.com/
and download JSON https://github.com/brijeshb42/monaco-themes/blob/master/themes/Tomorrow.json
const TOMORROW_MONACO_THEME = ...
0
votes
0
answers
26
views
Monaoc Editor (ngx-monaco-editor) in Angular is not reponding to newly added action (Ctrl + L) for clearing editor, for the first try
I have added a new action (Hot key - Ctrl + L) to clear editor window using the code below. It does call the defined clearEditor() function but editor is not refreshing/clearing out. I manually have ...
0
votes
1
answer
17
views
why the result of window.getSelection.toString becomes ellipsis,when seleced text a little long?
when i use monaco-editor in my program, and when i select some long codes in the editor,the result of window.getSelection.toString becomes ellipsis,like "xxxxxx ... xxxxx",while it goes ...
0
votes
0
answers
40
views
Monaco-editor with vscode extension webpack webview
I am trying to implement monaco-editor into custom vscode extension and I've tried it in so many ways to import it, but I cannot figure it out (there are either random errors from monaco-editor files, ...
0
votes
0
answers
23
views
Create my own language from xml in Monaco editor [closed]
I want to create my own language in Monaco Editor for use in my site.
My language is made from XML and I'd like to know if I have to code everything by hand or if there's a way to complete Monaco's ...
0
votes
0
answers
21
views
How to interact with a javascript variable in python using wx.html2.Webview in wxPython
It seems I have a very easy problem to solve but with my little experience working with web technologies I'll be more than grateful if someone bring some light in this darkness.
I am testing the ...
1
vote
0
answers
29
views
npm workspace - read dependency d.ts file as string
I have a monorepo which uses the npm workspace feature. The packages can be built with using vite and d.ts files are generated using vite-plugin-dts.
So lets say the project consists of two packages ...
0
votes
0
answers
28
views
How can i define a toolbar for MonacoEditor in React JS?
I have defined a monaco editor in react js as follows:
<MonacoEditor
height="200"
width=...
0
votes
0
answers
27
views
Flutter web project with javascript modules that use requireJS (Monaco editor in Flutter web)
I'm trying to use the Monaco editor in Flutter Web.
The simplest way that I see is to sync load all the resources example.
Here's a stand alone html file:
<!DOCTYPE html>
<html lang="en&...
0
votes
1
answer
42
views
Embedded Monaco Editor instance fails at editor.main.js = $ is not a function
I'm developing a web desktop, and I'm trying to integrate the monaco editor as an app. The first time I tried it actually worked, but then the next commit I can't figure out for the life of me what ...
0
votes
0
answers
12
views
I tried editor.trigger('myapp','undo') but it's not working as expected
I tried the below code for undo operation, but it's not working as i expected
editor.trigger('whatever...','undo');
This line is reverting the changes but word by word.
For Example: I have added the ...
0
votes
0
answers
32
views
When using monaco-editor in vite ,An error was rejected,
nextTick(() => {
// init
const node = document.getElementById('monacoElement');
if (node) {
monacoEditor.value = monaco.editor.createDiffEditor(node, {
theme: 'vs',
...
0
votes
0
answers
17
views
How to scan codebase for completion suggestions with Monaco Editor?
I'm writing an Electron (or Tauri) app that uses Monaco Editor.
Autocomplete does present suggestions from the current document as well from the language you're working in, but I'm not sure how to ...
0
votes
0
answers
32
views
How to show description by default in JSON schema in monaco-editor?
I am using monaco as a json editor, I have the JSON schema configured and the autocompletion works fine. I've given each field a description, which will be visible in the autocomplete show more. Is ...
0
votes
0
answers
32
views
Monaco Editor is removing html and style tags
I am Using Monaco Editor in my project, When I am posting Html content in monaco editor, and previewing the same content, html and style tags are being removed. so styles are not being applied in the ...
0
votes
0
answers
24
views
monaco editor is stripping html and style tags
I am Using Monaco Editor in my project, When I am posting Html content in monaco editor, and previewing the same content, html and style tags are being removed. so styles are not being applied in the ...
0
votes
0
answers
26
views
Remove text Decoration with react monaco editor
Hello I'm working with monaco editor on react and I highlight some part of my text thanks to the deltaDecorations
const editor = monacoEditorRef.current;
const model = editor.getModel();
...
0
votes
1
answer
31
views
How can I select the entire range in a Monaco editor?
I'm using the following code to replace the text in my editor. (See executeEdits.)
const text = "My new text"
const range = {
startLineNumber: 1,
startColumn: 1,
endLineNumber: 999999,
...
1
vote
0
answers
27
views
How to make monaco-editor block window object and document object?
Because of special needs, it is necessary to let the user try not to use the window or document object, if the user inputs the window or document so that monaco-editor does not appear code prompts;
I ...
0
votes
1
answer
49
views
Is there a way to set token background color in monaco editor?
I want to customize a language with tokens that have a background color. Setting foreground color (the color of the text itself) is as simple as setting the foreground option:
{
token: "...
0
votes
0
answers
28
views
Monaco Editor Incorrectly Detecting Brackets
How can I tell Monaco not to recognize my brackets when they are part of certain tokens? For example, my language has an arrow operator =>.
As far as I could tell from looking at the source, '...
1
vote
0
answers
23
views
How we can implement Auto rename tag feature in monaco editor similar to AutoRenameTag extension of vscode?
Question:
I am working with Monaco Editor and I want to add an "Auto Rename Tag" feature, similar to the functionality provided by the AutoRenameTag extension in Visual Studio Code. This ...
1
vote
0
answers
14
views
IDiffNavigator is gone in monaco editor v44
Previously in v38 we use const naviRef = useRef<monaco.editor.IDiffNavigator>() to navigate among changes and it works well.
When switched to v44 the navigator class is gone. What's the current ...
0
votes
0
answers
48
views
Start monaco with required jsonschema fields as the default value
I'm using monaco-yaml with React and have a requirement where I need to show the editor with the required values from a jsonschema.
Here's a simplified snippet of my code:
export const Editor: FC = () ...
0
votes
1
answer
44
views
How to use addExtraLib in Monaco Editor with an npm package?
I'm trying to use Monaco Editor with an npm package that provides custom type definitions for a specific library.
I am using '@monaco-editor/react', and this is my onMount function.
const ...
0
votes
0
answers
17
views
Use both dropdown and inline completions for different types of completions
I've got a project that uses Monaco for source code editing and has Intelllisense set up and working nicely using the normal dropdown.
I'd now like to additionally add inline suggestions from a ...
0
votes
2
answers
117
views
Monaco Editor & Typescript: How to add global types?
How can I instruct the Monaco editor that a set of types is global? Here's what I've tried. With the setup below, I can successfully write import type { Foo } from "my-lib"; into the Monaco ...
0
votes
0
answers
41
views
How does codingame.com's monaco c# language server implementation work
I'm trying to setup a monaco editor in a web project with working C#/.NET IntelliSense. The lack of available resources for this topic is a major problem for me.
By trial and error and some random ...
0
votes
1
answer
59
views
Monaco Editor: set cursor position within a provideOnTypeFormattingEdits
I am using the following code to auto close an xml tag when typing the '>' of an openening tag.
Everything works fine so far. But i want to set the cursor inbetween the tags. Instead the cursor ...
0
votes
1
answer
24
views
Editor isnt focusable when inside swiper slide
I'm using the package swiper/react to create a two-panel view that the user can swipe between. I am also using the package @monaco-editor/react so my user can write code.
The issue that I'm facing is ...
1
vote
0
answers
86
views
getting issue in @monaco-editor/react
./node_modules/@monaco-editor/react/dist/index.mjs 124:62
Module parse failed: Unexpected token (124:62)
File was processed with these loaders:
./node_modules/babel-loader/lib/index.js
You may need ...
0
votes
0
answers
94
views
react-monaco-editor go to definition in JSON schema
I'm using the react-monaco-editor (https://www.npmjs.com/package/react-monaco-editor?activeTab=readme) in my create-react-app project.
I have a json schema:
...
"some-property": {
&...
0
votes
0
answers
33
views
Monaco Editor Delete 2 characters
I use monaco-editor for my React project, and when I delete data in monaco-editor, it's delete 2 character.
This is my code:
useEffect(() => {
const editorContainer = document.getElementById(...
3
votes
1
answer
72
views
Add mermaid syntax into monaco-editor in ReactJS
I try to add mermaid syntax into monaco-editor via Monaco-mermaid, It it's return an error:
enter image description here
This is my code:
import React, { useEffect, useRef } from "react";
...
1
vote
0
answers
46
views
Why does the console.log() tooltip show logarithm in Google Scripts? [closed]
I was working on a project in the Google Apps Scripts editor and used a console.log in my code. For some reason, instead of the typical console.log tooltip thing, I got a different and incorrect one. ...
0
votes
0
answers
27
views
Support for "hideUnchangedRegions" in monaco Editor
As the support for hideUnchangedRegions is added for vs code editor and being used, Is this supported in monaco editor.
i tried setting this up here
Playground link
Any help would be suggested,
The ...
0
votes
0
answers
50
views
How to make Monaco editor show \n or \" in the editor
I have the following problem, I want Monaco editor to literally show me the characters as I passed them in the value, to show \n and \". But it couldn't, any suggestions?
this is my code
...
0
votes
0
answers
37
views
Ho to make Go to/Peek actions available in command pallete
In VS Code you can run (and configure) Go to/Peek actions
from the command palette.
However, it is not a case for Monaco editor. I can't find commands neither in palette, nor programmaticaly.
For ...
0
votes
1
answer
163
views
Get absolute (index) position of cursor in Monaco Editor
I am retrieving text as string from editor and want to insert some marker text _CURSOR_ to position of cursor.
Here is the code:
let editor = /* ... */;
// Getting text
let text = editor.getValue();
...
0
votes
0
answers
31
views
Monaco Editor Never Trigger Auto Completion
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
const container = document.createElement('div');
container.style.width = '100vw';
container.style.height = '100vh';
document.body....
0
votes
0
answers
163
views
Monaco Editor Module parse failed: Unexpected token Angular 14
My angular project stopped working after tried to use the createDecorationsCollection methode on the init event of the ngx-monaco-editor - component.
With a lot of error messages that look like these:
...
0
votes
1
answer
65
views
Different Monaco editor components sharing same schema
Describe the bug
I have 2 separate components with Monaco editor react of value JSON. One of the editor has a schema validation defined, problem is another instance also validating with same schema. ...
0
votes
0
answers
17
views
Is there a way to customise the web editor?
I'm not sure whether the one in the video is official, but I'm making a Roblox executor in the Lua language for Monaco, and I was wondering if there is a way to customise Monaco (e.g. changing some ...
0
votes
0
answers
14
views
documentChanges contains unopened files get error: bad edit - model not found
[email protected]
[email protected]
I recently encountered an issue whilst using the ‘rename symbol’ feature on Monaco Editor. The problem arises specifically when trying to rename ...
0
votes
0
answers
94
views
Monaco Editor throws Uncaught ReferenceError: monaco is not defined Error after install through npm
I am trying to implement a monaco diff editor in my project that compares two json objects. Now I am still quite new to node.js and node modules, so perhaps the answer to this might be easier than I ...
0
votes
0
answers
34
views
Get the value of Monaco Editor after new text is appended
In the following demo using the Monaco Editor Playground, drag/droping the "box" appends text at the cursor position of the editor. However, I am unable to get the appended value of the ...
0
votes
0
answers
32
views
Knockout with Monaco - Close Modal Not Updating
I have a page that has a monaco editor textbox. I have an Edit button that, on clicked, opens a modal window with a new monaco textbox (it gets initialized with the value from the model bound to first ...
0
votes
0
answers
48
views
Sharing intellisense features for VSCode Extension & Electron app with Monaco Editor
Background
I am working on a desktop application build with Electron, Electron-forge, TypeScript, React, Webpack.
One of the features is a editor to write a custom language.
For this I have used the ...
0
votes
0
answers
67
views
Monaco editor split column with @monaco-editor/react npm package in react
I am trying to split my monaco editor into 2 separate columns as one of them will be used for config changes using JSON format for E Charts and other column for showing the code samples for new users ...
1
vote
2
answers
238
views
How to wait for Monaco Editor validation to complete?
In the monaco editor, I wanted to wait for the JSON validation to complete. If I used onDidChangeModelContent, the error information that the callback picked up by getModelMarkers is not up to date.
...