Skip to content

Commit f7e2646

Browse files
committed
Use textmate
1 parent c2fcf54 commit f7e2646

File tree

5 files changed

+62
-48
lines changed

5 files changed

+62
-48
lines changed

docusaurus.config.js

Lines changed: 7 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@
44
const path = require("path");
55
const { createHash } = require("crypto");
66
const _ = require("lodash");
7-
const MonacoEditorWebpackPlugin = require("monaco-editor-webpack-plugin");
87

98
const originalFilePath = path.resolve(
109
require.resolve("monaco-editor/package.json"),
@@ -254,6 +253,13 @@ const config = {
254253
test: /\.yaml/,
255254
type: "asset/source",
256255
},
256+
{
257+
test: /\.wasm$/,
258+
type: "asset/resource",
259+
generator: {
260+
filename: "[name].[hash][ext]",
261+
},
262+
},
257263
],
258264
},
259265
plugins: [
@@ -285,24 +291,6 @@ const config = {
285291
],
286292
}),
287293
new EmitBootstrapJsonPlugin(),
288-
new MonacoEditorWebpackPlugin({
289-
languages: ["javascript", "typescript", "css" /* , 'yaml' */],
290-
features: [
291-
// "!accessibilityHelp",
292-
"!codelens",
293-
"!colorPicker",
294-
"!documentSymbols",
295-
"!fontZoom",
296-
"!iPadShowKeyboard",
297-
"!inspectTokens",
298-
"!stickyScroll",
299-
"!links",
300-
"!inlayHints",
301-
"!documentSymbols",
302-
"!browser",
303-
],
304-
filename: `workers/[name].[contenthash:8].worker.js`,
305-
}),
306294
new currentBundler.instance.NormalModuleReplacementPlugin(
307295
new RegExp(`^${_.escapeRegExp(originalFilePath)}$`),
308296
// Refactor without 'd' flag of RegExp

package.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,12 +28,11 @@
2828
"@next-bricks/form": "^1.15.13",
2929
"@next-bricks/icons": "^1.3.23",
3030
"@next-bricks/shoelace": "^1.1.9",
31-
"@next-core/monaco-contributions": "^0.3.14",
3231
"@next-core/preview": "^0.7.51",
32+
"@next-shared/monaco-textmate": "^0.1.2",
3333
"clsx": "^2.1.1",
3434
"lodash": "^4.17.21",
3535
"monaco-editor": "^0.50.0",
36-
"monaco-editor-webpack-plugin": "^7.1.0",
3736
"prism-react-renderer": "^2.1.0",
3837
"react": "^19.0.0",
3938
"react-dom": "^19.0.0"

src/components/MonacoEditorWorkspace/index.tsx

Lines changed: 30 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -6,22 +6,32 @@ import React, {
66
useRef,
77
useState,
88
} from "react";
9-
import * as monaco from "monaco-editor/esm/vs/editor/editor.api";
9+
import * as monaco from "monaco-editor";
10+
import { initializeTokensProvider } from "@next-shared/monaco-textmate";
11+
import "@next-shared/monaco-textmate/workers.js";
12+
import tmVsLight from "@next-shared/monaco-textmate/themes/light-modern.json";
13+
import tmVsDark from "@next-shared/monaco-textmate/themes/dark-modern.json";
1014
import {
1115
EDITOR_SCROLLBAR_SIZE,
1216
EDITOR_PADDING_TOP,
1317
EXAMPLE_CODE_LINE_HEIGHT,
1418
} from "@site/src/constants";
1519
import clsx from "clsx";
1620
import type { FileInfo } from "@site/src/interfaces";
17-
import { register as registerJavaScript } from "@next-core/monaco-contributions/javascript";
18-
import { register as registerTypeScript } from "@next-core/monaco-contributions/typescript";
19-
import { register as registerYaml } from "@next-core/monaco-contributions/yaml";
2021
import styles from "./styles.module.css";
2122

22-
registerJavaScript(monaco);
23-
registerTypeScript(monaco);
24-
registerYaml(monaco);
23+
monaco.editor.defineTheme(
24+
"tm-vs-light",
25+
tmVsLight as monaco.editor.IStandaloneThemeData
26+
);
27+
monaco.editor.defineTheme(
28+
"tm-vs-dark",
29+
tmVsDark as monaco.editor.IStandaloneThemeData
30+
);
31+
32+
initializeTokensProvider("javascript");
33+
initializeTokensProvider("typescript");
34+
initializeTokensProvider("brick_next_yaml");
2535

2636
export interface MonacoEditorWorkspaceProps {
2737
files: FileInfo[];
@@ -56,6 +66,13 @@ monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
5666
lib: [],
5767
});
5868

69+
function convertLanguage(lang: string) {
70+
if (lang === "yaml") {
71+
return "brick_next_yaml";
72+
}
73+
return lang;
74+
}
75+
5976
export default forwardRef<MonacoEditorWorkspaceRef, MonacoEditorWorkspaceProps>(
6077
function MonacoEditorWorkspace(
6178
{ files, currentFile, className, theme, typingEffectReady, onChange },
@@ -79,21 +96,20 @@ export default forwardRef<MonacoEditorWorkspaceRef, MonacoEditorWorkspaceProps>(
7996
const file = files.find((f) => f.name === currentFile);
8097
model = monaco.editor.createModel(
8198
file.codeSlides?.[0] ?? file.code,
82-
file.lang ?? "yaml",
99+
convertLanguage(file.lang ?? "yaml"),
83100
monaco.Uri.file(`${workspace}/${file.name}`)
84101
);
85102
modelsMap.set(currentFile, model);
86103
}
87104
return model;
88105
}, [currentFile, modelsMap, files, workspace]);
89106

107+
const convertedTheme = theme === "vs-dark" ? "tm-vs-dark" : "tm-vs-light";
90108
useEffect(() => {
91-
if (theme) {
92-
// Currently theme is configured globally.
93-
// See https://github.com/microsoft/monaco-editor/issues/338
94-
monaco.editor.setTheme(theme);
95-
}
96-
}, [theme]);
109+
// Currently theme is configured globally.
110+
// See https://github.com/microsoft/monaco-editor/issues/338
111+
monaco.editor.setTheme(convertedTheme);
112+
}, [convertedTheme]);
97113

98114
useEffect(() => {
99115
if (editorRef.current) {

src/global.d.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,11 @@ declare module "*.raw.css" {
88
export default content;
99
}
1010

11+
declare module "*.module.css" {
12+
const classes: { [key: string]: string };
13+
export default classes;
14+
}
15+
1116
declare module "*.png" {
1217
const url: string;
1318
export default url;

yarn.lock

Lines changed: 19 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2125,16 +2125,19 @@
21252125
resolved "https://registry.yarnpkg.com/@next-bricks/shoelace/-/shoelace-1.1.9.tgz#2fc69e92705516a63862fb1103ad77d78ccb212c"
21262126
integrity sha512-yLl1zhTj1Y/sPAWOfeYbIzDuU10HrG4pfYRBGTnQtQVrfwDzApN6AeckcckFUMZzXZNku0BaHu5uf9UGEDjRDA==
21272127

2128-
"@next-core/monaco-contributions@^0.3.14":
2129-
version "0.3.14"
2130-
resolved "https://registry.yarnpkg.com/@next-core/monaco-contributions/-/monaco-contributions-0.3.14.tgz#2627f6256c9832d1844c7107719f0d3893a0a7ac"
2131-
integrity sha512-9iw5SIA/O6USb5mrr3zrK1L8yNymobn3WdgC2SA3Ms4F6K2ESu0BGHNKASOVAJe7ko1PKs5uMPUCqG5+pjKLmA==
2132-
21332128
"@next-core/preview@^0.7.51":
21342129
version "0.7.51"
21352130
resolved "https://registry.yarnpkg.com/@next-core/preview/-/preview-0.7.51.tgz#d0998eb96e87315bfdab9e181f5b7500c693488e"
21362131
integrity sha512-ZbX3wm+GN3ZpVW4M8Z6tazi9ZUmcXKlGoshlHQICCLuu9gPJ4a3BjnMML9A2bj1ko53nW9W7DW1HNcfjTchd6Q==
21372132

2133+
"@next-shared/monaco-textmate@^0.1.2":
2134+
version "0.1.2"
2135+
resolved "https://registry.yarnpkg.com/@next-shared/monaco-textmate/-/monaco-textmate-0.1.2.tgz#e72c5f42c8e90e4f5c9e842915c9e7723477ed9b"
2136+
integrity sha512-gSoF4VtFpwh55gS9jYC71wOwnPCXBBDDIU+LgXhpAc08y7qQFCfHunDoTE6gPpoAuDUO+TKIjc4uvS8QJKGyxw==
2137+
dependencies:
2138+
vscode-oniguruma "^2.0.1"
2139+
vscode-textmate "^9.2.0"
2140+
21382141
"@node-rs/[email protected]":
21392142
version "1.7.0"
21402143
resolved "https://registry.yarnpkg.com/@node-rs/jieba-android-arm-eabi/-/jieba-android-arm-eabi-1.7.0.tgz#50b9921c6feb44755584963e8e00e425e557965a"
@@ -6550,7 +6553,7 @@ loader-runner@^4.2.0:
65506553
resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-4.3.0.tgz#c1b4a163b99f614830353b16755e7149ac2314e1"
65516554
integrity sha512-3R/1M+yS3j5ou80Me59j7F9IMs4PXs3VqRrm0TU3AbKPxlmpoY1TNscJV/oGJXo8qCatFGTfDbY6W6ipGOYXfg==
65526555

6553-
loader-utils@^2.0.0, loader-utils@^2.0.2:
6556+
loader-utils@^2.0.0:
65546557
version "2.0.4"
65556558
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-2.0.4.tgz#8b5cb38b5c34a9a018ee1fc0e6a066d1dfcc528c"
65566559
integrity sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==
@@ -7447,13 +7450,6 @@ minimist@^1.2.0:
74477450
resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
74487451
integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
74497452

7450-
monaco-editor-webpack-plugin@^7.1.0:
7451-
version "7.1.0"
7452-
resolved "https://registry.yarnpkg.com/monaco-editor-webpack-plugin/-/monaco-editor-webpack-plugin-7.1.0.tgz#16f265c2b5dbb5fe08681b6b3b7d00d3c5b2ee97"
7453-
integrity sha512-ZjnGINHN963JQkFqjjcBtn1XBtUATDZBMgNQhDQwd78w2ukRhFXAPNgWuacaQiDZsUr4h1rWv5Mv6eriKuOSzA==
7454-
dependencies:
7455-
loader-utils "^2.0.2"
7456-
74577453
monaco-editor@^0.50.0:
74587454
version "0.50.0"
74597455
resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.50.0.tgz#44e62b124c8aed224e1d310bbbe6ffd6d5122413"
@@ -10100,6 +10096,16 @@ vfile@^6.0.0, vfile@^6.0.1:
1010010096
unist-util-stringify-position "^4.0.0"
1010110097
vfile-message "^4.0.0"
1010210098

10099+
vscode-oniguruma@^2.0.1:
10100+
version "2.0.1"
10101+
resolved "https://registry.yarnpkg.com/vscode-oniguruma/-/vscode-oniguruma-2.0.1.tgz#1196a343635ff8d42eb880e325b5f4e70731c02f"
10102+
integrity sha512-poJU8iHIWnC3vgphJnrLZyI3YdqRlR27xzqDmpPXYzA93R4Gk8z7T6oqDzDoHjoikA2aS82crdXFkjELCdJsjQ==
10103+
10104+
vscode-textmate@^9.2.0:
10105+
version "9.2.0"
10106+
resolved "https://registry.yarnpkg.com/vscode-textmate/-/vscode-textmate-9.2.0.tgz#be2b04b3f8853135b2d67274670540215c5bb92b"
10107+
integrity sha512-rkvG4SraZQaPSN/5XjwKswdU0OP9MF28QjrYzUBbhb8QyG3ljB1Ky996m++jiI7KdiAP2CkBiQZd9pqEDTClqA==
10108+
1010310109
watchpack@^2.4.1:
1010410110
version "2.4.2"
1010510111
resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-2.4.2.tgz#2feeaed67412e7c33184e5a79ca738fbd38564da"

0 commit comments

Comments
 (0)