82 lines
2.3 KiB
HTML
82 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
|
<link
|
|
rel="stylesheet"
|
|
data-name="vs/editor/editor.main"
|
|
href="../node_modules/monaco-editor-core/dev/vs/editor/editor.main.css"
|
|
/>
|
|
</head>
|
|
<body>
|
|
<h2>Monaco Editor HTML test page</h2>
|
|
<div
|
|
id="container"
|
|
style="width: 800px; height: 600px; border: 1px solid grey"
|
|
></div>
|
|
|
|
<script>
|
|
// Loading basic-languages to get the html language definition
|
|
var paths = {
|
|
'vs/basic-languages': '../node_modules/monaco-languages/release/dev',
|
|
'vs/language/html': '../release/dev',
|
|
vs: '../node_modules/monaco-editor-core/dev/vs'
|
|
};
|
|
if (document.location.protocol === 'http:') {
|
|
// Add support for running local http server
|
|
let testIndex = document.location.pathname.indexOf('/test/');
|
|
if (testIndex !== -1) {
|
|
let prefix = document.location.pathname.substr(0, testIndex);
|
|
paths['vs/language/html'] = prefix + '/release/dev';
|
|
}
|
|
}
|
|
var require = {
|
|
paths: paths
|
|
};
|
|
</script>
|
|
<script src="../node_modules/monaco-editor-core/dev/vs/loader.js"></script>
|
|
<script src="../node_modules/monaco-editor-core/dev/vs/editor/editor.main.nls.js"></script>
|
|
<script src="../node_modules/monaco-editor-core/dev/vs/editor/editor.main.js"></script>
|
|
|
|
<script>
|
|
require([
|
|
'vs/basic-languages/monaco.contribution',
|
|
'vs/language/html/monaco.contribution'
|
|
], function () {
|
|
var editor = monaco.editor.create(
|
|
document.getElementById('container'),
|
|
{
|
|
value: [
|
|
'<!DOCTYPE HTML>',
|
|
'<!--',
|
|
' Comments are overrated',
|
|
'-->',
|
|
'<html>',
|
|
'<head>',
|
|
' <title>HTML Sample</title>',
|
|
' <meta http-equiv="X-UA-Compatible" content="IE=edge">',
|
|
' <style type="text/css">',
|
|
' h1 {',
|
|
' color: #CCA3A3;',
|
|
' }',
|
|
' </style>',
|
|
' <script type="text/javascript">',
|
|
' window.alert("I am a sample...");',
|
|
' var x = 3;',
|
|
' </' + 'script>',
|
|
'</head>',
|
|
'<body>',
|
|
' <h1>Heading No.1</h1>',
|
|
' <input disabled type="button" value="Click me" />',
|
|
'</body>',
|
|
'</html>'
|
|
].join('\n'),
|
|
language: 'html'
|
|
}
|
|
);
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|