Skip to content

Commit 70d4f59

Browse files
authored
Load Monaco from CDN (#1939)
<!-- CURSOR_SUMMARY --> > [!NOTE] > Load Monaco via @monaco-editor/react loader, drop custom workers, and initialize themes/TypeScript after loader init. > > - **Editor/Monaco**: > - Switch to `@monaco-editor/react` `loader.init()` with type-only `editor` import. > - Remove worker imports and `MonacoEnvironment.getWorker` configuration. > - Move theme registration (`dyad-light`, `dyad-dark`) and TypeScript compiler/diagnostics setup into the loader init callback. > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit c4b7c02. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup> <!-- /CURSOR_SUMMARY --> <!-- This is an auto-generated description by cubic. --> --- ## Summary by cubic Load Monaco from a CDN via @monaco-editor/react and initialize themes/TypeScript settings after loader init. This reduces bundle size and removes custom worker setup. - **Refactors** - Removed web worker imports and MonacoEnvironment configuration. - Switched from direct monaco import to type-only import; initialization now uses loader.init(). - Moved theme registration (dyad-light/dark) and TS compiler/diagnostics setup into the loader init callback. <sup>Written for commit c4b7c02. Summary will update automatically on new commits.</sup> <!-- End of auto-generated description by cubic. -->
1 parent 1ce3995 commit 70d4f59

File tree

1 file changed

+12
-45
lines changed

1 file changed

+12
-45
lines changed

src/components/chat/monaco.ts

Lines changed: 12 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,6 @@
1-
import { editor } from "monaco-editor";
2-
1+
import type { editor } from "monaco-editor";
32
import { loader } from "@monaco-editor/react";
43

5-
import * as monaco from "monaco-editor";
6-
// @ts-ignore
7-
import editorWorker from "monaco-editor/esm/vs/editor/editor.worker?worker";
8-
// @ts-ignore
9-
import jsonWorker from "monaco-editor/esm/vs/language/json/json.worker?worker";
10-
// @ts-ignore
11-
import cssWorker from "monaco-editor/esm/vs/language/css/css.worker?worker";
12-
// @ts-ignore
13-
import htmlWorker from "monaco-editor/esm/vs/language/html/html.worker?worker";
14-
// @ts-ignore
15-
import tsWorker from "monaco-editor/esm/vs/language/typescript/ts.worker?worker";
16-
17-
self.MonacoEnvironment = {
18-
getWorker(_, label) {
19-
if (label === "json") {
20-
return new jsonWorker();
21-
}
22-
if (label === "css" || label === "scss" || label === "less") {
23-
return new cssWorker();
24-
}
25-
if (label === "html" || label === "handlebars" || label === "razor") {
26-
return new htmlWorker();
27-
}
28-
if (label === "typescript" || label === "javascript") {
29-
return new tsWorker();
30-
}
31-
return new editorWorker();
32-
},
33-
};
34-
35-
loader.config({ monaco });
36-
37-
// loader.init().then(/* ... */);
384
export const customLight: editor.IStandaloneThemeData = {
395
base: "vs",
406
inherit: false,
@@ -106,8 +72,6 @@ export const customLight: editor.IStandaloneThemeData = {
10672
},
10773
};
10874

109-
editor.defineTheme("dyad-light", customLight);
110-
11175
export const customDark: editor.IStandaloneThemeData = {
11276
base: "vs-dark",
11377
inherit: false,
@@ -178,12 +142,15 @@ export const customDark: editor.IStandaloneThemeData = {
178142
},
179143
};
180144

181-
editor.defineTheme("dyad-dark", customDark);
182-
183-
monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
184-
jsx: monaco.languages.typescript.JsxEmit.React, // Enable JSX
185-
});
186-
monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({
187-
// Too noisy because we don't have the full TS environment.
188-
noSemanticValidation: true,
145+
loader.init().then((monaco) => {
146+
monaco.editor.defineTheme("dyad-light", customLight);
147+
monaco.editor.defineTheme("dyad-dark", customDark);
148+
149+
monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
150+
jsx: monaco.languages.typescript.JsxEmit.React, // Enable JSX
151+
});
152+
monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({
153+
// Too noisy because we don't have the full TS environment.
154+
noSemanticValidation: true,
155+
});
189156
});

0 commit comments

Comments
 (0)