dan/monaco-yaml
1
0
Fork 0
mirror of https://github.com/danbulant/monaco-yaml synced 2026-06-21 23:52:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #116 from remcohaszing/vite-example

Browse source 
Add minimal vite example
This commit is contained in:
Remco Haszing 2021-11-15 17:29:29 +01:00 committed by GitHub
commit c008952c87
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 11203 additions and 1924 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
examples/minimal-vite/README.md Normal file
View file

@ -0,0 +1,3 @@
# Minimal Vite Example
This minimal example shows how `monaco-yaml` can be used with [Vite](https://vitejs.dev).

11
examples/minimal-vite/index.html Normal file
View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Monaco YAML</title>
</head>
<body>
<div id="editor" style="width: 800px; height: 600px;"></div>
<script type="module" src="/index.js"></script>
</body>
</html>

67
examples/minimal-vite/index.js Normal file
View file

@ -0,0 +1,67 @@
import { editor, Uri } from 'monaco-editor';
import EditorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
import { setDiagnosticsOptions } from 'monaco-yaml';
import YamlWorker from 'monaco-yaml/lib/esm/yaml.worker?worker';
window.MonacoEnvironment = {
getWorker(moduleId, label) {
switch (label) {
case 'editorWorkerService':
return new EditorWorker();
case 'yaml':
return new YamlWorker();
default:
throw new Error(`Unknown label ${label}`);
}
},
};
// The uri is used for the schema file match.
const modelUri = Uri.parse('a://b/foo.yaml');
setDiagnosticsOptions({
enableSchemaRequest: true,
hover: true,
completion: true,
validate: true,
format: true,
schemas: [
{
// Id of the first schema
uri: 'http://myserver/foo-schema.json',
// Associate with our model
fileMatch: [String(modelUri)],
schema: {
type: 'object',
properties: {
p1: {
enum: ['v1', 'v2'],
},
p2: {
// Reference the second schema
$ref: 'http://myserver/bar-schema.json',
},
},
},
},
{
// Id of the first schema
uri: 'http://myserver/bar-schema.json',
schema: {
type: 'object',
properties: {
q1: {
enum: ['x1', 'x2'],
},
},
},
},
],
});
const value = 'p1: \np2: \n';
editor.create(document.getElementById('editor'), {
automaticLayout: true,
model: editor.createModel(value, 'yaml', modelUri),
});

14
examples/minimal-vite/package.json Normal file
View file

@ -0,0 +1,14 @@
{
"name": "minimal-vite",
"version": "1.0.0",
"private": true,
"scripts": {
"start": "vite",
"build": "vite build"
},
"dependencies": {
"monaco-editor": "^0.30.0",
"monaco-yaml": "file:../..",
"vite": "^2.0.0"
}
}

13032
package-lock.json generated
View file

File diff suppressed because it is too large Load diff