Skip to content
This repository has been archived by the owner on Feb 6, 2024. It is now read-only.

Latest commit

 

History

History
67 lines (50 loc) · 1.88 KB

File metadata and controls

67 lines (50 loc) · 1.88 KB

npm license

DeckDeckGo - Monaco Editor

A web component to easily embed the Monaco Editor in your application.

Installation

npm i @deckdeckgo/monaco-editor

Usage

  1. Import the component in your application, for example with an import script.
import @deckdeckgo/monaco-editor
  1. Copy the pre-compiled workers to your output - e.g. www, public, dist - folder or sub-folder(s) - e.g. www/build/workers.
copy: [
    {src: `${__dirname}/node_modules/@deckdeckgo/monaco-editor/workers/`, dest: `${__dirname}/public`}
]
  1. Configure where the worker scripts are located i.e. add following script in your application (update the path ./ if you have copied the scripts in sub-folders).
self.MonacoEnvironment = {
    getWorkerUrl: function (_moduleId, label) {
      if (label === 'json') {
        return './json.worker.js';
      }
      if (label === 'css' || label === 'scss' || label === 'less') {
        return './css.worker.js';
      }
      if (label === 'html' || label === 'handlebars' || label === 'razor') {
        return './html.worker.js';
      }
      if (label === 'typescript' || label === 'javascript') {
        return './ts.worker.js';
      }
      return './editor.worker.js';
    }
};
  1. Use the component
<deckgo-monaco-editor></deckgo-monaco-editor>

License

MIT © David Dal Busco and Nicolas Mattia