NGE IDE

Overview

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.

Packages

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.

Compatibility

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

Installation

npm install @cisstech/nge @cisstech/nge-ide monaco-editor marked

Monaco 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.

Documentation

Guides, API reference and a live playground are at cisstech.github.io/nge-ide.

Development

git clone https://github.com/cisstech/nge-ide
cd nge-ide
yarn install
yarn start

• yarn build:lib builds the library.
• yarn test runs the unit tests.
• yarn lint runs the linter.

Contributing

Issues and pull requests are welcome. Please open an issue to discuss substantial changes first.

Support

If this project is useful to you, a star on GitHub is appreciated.

License

MIT © Mamadou Cisse