An extensible, file-system-agnostic code editor for the web, built with Angular.
NGE IDE embeds the shell of a desktop code editor (a file explorer, tabbed Monaco
editors, side panels and a status bar) into an Angular application, behind a
single <ide-root />. It does not assume where your files live: you register a
file system provider, and you extend the workbench with your own commands, views
and editors through a small contribution system.
Everything ships as one npm package with several entry points:
| Entry point | Description |
|---|---|
@cisstech/nge-ide |
The IDE shell rendered by <ide-root />. |
@cisstech/nge-ide/core |
Services and the file-system, editor, contribution and theme APIs. |
@cisstech/nge-ide/explorer |
File-tree explorer in the sidebar. |
@cisstech/nge-ide/search |
Search across a file system that supports it. |
@cisstech/nge-ide/settings |
Settings editor and its sidebar entry. |
@cisstech/nge-ide/problems |
Diagnostics panel in the info bar. |
@cisstech/nge-ide/notifications |
Notifications panel in the info bar. |
The major version of nge-ide tracks Angular and @cisstech/nge.
| nge-ide | Angular | @cisstech/nge | Node |
|---|---|---|---|
| 22.x | 22.x | 22.x | ^20.19, ^22.12 or >= 24 |
| 18.x | 18.x | 18.x | ^18 or ^20 |
npm install @cisstech/nge @cisstech/nge-ide monaco-editor markedMonaco loads its workers and themes at runtime, so copy @cisstech/nge's Monaco
assets into your build. The Getting started
guide covers the full setup.
Guides, API reference and a live playground are at cisstech.github.io/nge-ide.
git clone https://github.com/cisstech/nge-ide
cd nge-ide
yarn install
yarn startyarn build:libbuilds the library.yarn testruns the unit tests.yarn lintruns the linter.
Issues and pull requests are welcome. Please open an issue to discuss substantial changes first.
If this project is useful to you, a star on GitHub is appreciated.
MIT © Mamadou Cisse