Monaco Editor是微软基于 VS Code 的开源代码编辑器,运行在浏览器环境中。编辑器提供代码提示,智能建议等功能。供开发人员远程更方便的编写代码。

网页集成:

嵌入编辑器最基本的HTML页面,更多的示例可在monaco-editor-samples找到

1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPEhtml>
<html>
<head>
    <metahttp-equiv="X-UA-Compatible"content="IE=edge"/>
    <metahttp-equiv="Content-Type"content="text/html;charset=utf-8">
</head>
<body>
<divid="container"="width:800px;height:600px;border:1px solid grey"></div>
<scriptsrc="monaco-editor/min/vs/loader.js"></script><script>    require.config({ paths: { 'vs': 'monaco-editor/min/vs' }});    require(['vs/editor/editor.main'], function() {        var editor = monaco.editor.create(document.getElementById('container'), {            value: [                'function x() {',                '\tconsole.log("Hello world!");',                '}'            ].join('\n'),            language: 'javascript'        });    });</script></body>
</html>

官网:https://code.visualstudio.com/docs/editor/editingevolved