使用require js导入monaco编辑器

Question

I have installed monaco-editor using

npm install monaco-editor

now I want to require in my js file

so I have tried to require using

var monaco = require('monaco-editor');

but it is giving me module not found error.

Is there wrong I am doing?

Answer 1

Monaco-editor uses a custom AMD style module loader. the loader.js will result in the global require being set to Monaco-editor's loader.

The samples GitHub has many examples of using the editor in different contexts.

Check out how they solve your problem in the Electorn samples index.html. After persisting the Monaco-editor custom loader you would use it like in most of the examples out there. It is an AMD style loader so the syntax differs from node var me = require('monaco') . I am not sure if it is possible to use like node loader but after loading loader.js and persisting the require to some variable such as amdRequire you will use such as:

amdRequire(['vs/editor/editor.main'], function () 
{ 
    // your code using monaco ns here
    monaco.editor.create( document.getElementById('elementId'), {} );
})

Answer 2

They just released ESM distribution which is compatible with webpack etc. Check out the docs here .

Also there are many examples for using monaco with webpack , parcel an so on. See all.