SystemSh0cker/monaco-editor
1
0
Fork 0
mirror of https://github.com/microsoft/monaco-editor.git synced 2025-12-22 20:52:56 +01:00
Code Issues Projects Releases Packages Activity

Run prettier

Browse source
This commit is contained in:
Alex Dima 2021-11-15 09:37:13 +01:00
parent a66f20ee2e
commit edb439d4f6
No known key found for this signature in database
GPG key ID: 39563C1504FDD0C9
14 changed files with 998 additions and 982 deletions
Download patch file Download diff file Expand all files Collapse all files

6
monaco-editor-samples/browser-esm-vite-react/src/components/Editor.module.css
View file

@ -1,4 +1,4 @@
.Editor {
width: 100vw;
height: 100vh;
}
width: 100vw;
height: 100vh;
}

35
monaco-editor-samples/browser-esm-vite-react/src/components/Editor.tsx
View file

@ -1,24 +1,23 @@
import { VFC, useRef, useState, useEffect } from "react";
import * as monaco from "monaco-editor/esm/vs/editor/editor.api";
import styles from "./Editor.module.css";
import { VFC, useRef, useState, useEffect } from 'react';
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
import styles from './Editor.module.css';
export const Editor: VFC = () => {
const [editor, setEditor] =
useState<monaco.editor.IStandaloneCodeEditor | null>(null);
const monacoEl = useRef(null);
const [editor, setEditor] = useState<monaco.editor.IStandaloneCodeEditor | null>(null);
const monacoEl = useRef(null);
useEffect(() => {
if (monacoEl && !editor) {
setEditor(
monaco.editor.create(monacoEl.current!, {
value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
language: "typescript",
})
);
}
useEffect(() => {
if (monacoEl && !editor) {
setEditor(
monaco.editor.create(monacoEl.current!, {
value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
language: 'typescript'
})
);
}
return () => editor?.dispose();
}, [monacoEl.current]);
return () => editor?.dispose();
}, [monacoEl.current]);
return <div className={styles.Editor} ref={monacoEl}></div>;
return <div className={styles.Editor} ref={monacoEl}></div>;
};

18
monaco-editor-samples/browser-esm-vite-react/src/main.tsx
View file

@ -1,11 +1,11 @@
import React from 'react'
import ReactDOM from 'react-dom'
import {Editor} from './components/Editor'
import "./userWorker";
import React from 'react';
import ReactDOM from 'react-dom';
import { Editor } from './components/Editor';
import './userWorker';
ReactDOM.render(
<React.StrictMode>
<Editor />
</React.StrictMode>,
document.getElementById('root')
)
<React.StrictMode>
<Editor />
</React.StrictMode>,
document.getElementById('root')
);

42
monaco-editor-samples/browser-esm-vite-react/src/userWorker.ts
View file

@ -1,27 +1,27 @@
import * as monaco from "monaco-editor";
import editorWorker from "monaco-editor/esm/vs/editor/editor.worker?worker";
import jsonWorker from "monaco-editor/esm/vs/language/json/json.worker?worker";
import cssWorker from "monaco-editor/esm/vs/language/css/css.worker?worker";
import htmlWorker from "monaco-editor/esm/vs/language/html/html.worker?worker";
import tsWorker from "monaco-editor/esm/vs/language/typescript/ts.worker?worker";
import * as monaco from 'monaco-editor';
import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker';
import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker';
import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker';
import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker';
// @ts-ignore
self.MonacoEnvironment = {
getWorker(_: any, label: string) {
if (label === "json") {
return new jsonWorker();
}
if (label === "css" || label === "scss" || label === "less") {
return new cssWorker();
}
if (label === "html" || label === "handlebars" || label === "razor") {
return new htmlWorker();
}
if (label === "typescript" || label === "javascript") {
return new tsWorker();
}
return new editorWorker();
},
getWorker(_: any, label: string) {
if (label === 'json') {
return new jsonWorker();
}
if (label === 'css' || label === 'scss' || label === 'less') {
return new cssWorker();
}
if (label === 'html' || label === 'handlebars' || label === 'razor') {
return new htmlWorker();
}
if (label === 'typescript' || label === 'javascript') {
return new tsWorker();
}
return new editorWorker();
}
};
monaco.languages.typescript.typescriptDefaults.setEagerModelSync(true);