https://github.com/lofcz/monaco-breakpoints
A library for support breakpoints in monaco-editor
https://github.com/lofcz/monaco-breakpoints
Last synced: 8 months ago
JSON representation
A library for support breakpoints in monaco-editor
- Host: GitHub
- URL: https://github.com/lofcz/monaco-breakpoints
- Owner: lofcz
- Created: 2024-02-09T02:29:38.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-02-09T16:01:13.000Z (over 1 year ago)
- Last Synced: 2025-02-15T18:58:24.376Z (8 months ago)
- Language: TypeScript
- Homepage:
- Size: 96.7 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# monaco-breakpoints
## A type-safe library support breakpoints in monaco-editor like vscode
## Installing
```
> npm i monaco-breakpoints
> npm i monaco-editor@latest
```
## Usage
```typescript
import * as monaco from 'monaco-editor';
import { MonacoBreakpoint } from 'monaco-breakpoints';
const democode = [
'function foo() {\n',
'\treturn 1;\n',
'}\n',
'function bar() {\n',
'\treturn 1;\n',
'}',
].join('')
const editor = monaco.editor.create(document.getElementById('app')!, {
value: democode,
theme: 'vs-dark',
automaticLayout: true,
minimap: {
enabled: false,
},
glyphMargin: true,
});
const instance = new MonacoBreakpoint({ editor });
instance.on('breakpointChanged', breakpoints => {
console.log('breakpointChanged: ', breakpoints);
})
// highlight background for the passed line number
instance.setLineHighlight(1)
// remove the current highlight background
instance.removeHighlight();
```
## Packages
Please make sure your `monaco-editor` version is greater than or equal to `0.39.0`.
## example
https://codesandbox.io/p/sandbox/lingering-frost-53pjww?file=%2Fsrc%2FApp.vue%3A8%2C9
## License
Licensed under the MIT License.