fix: bundle grammars from shiki (#29)

package.json

@@ -14,7 +14,7 @@
       "types": "./dist/vue.worker.d.ts"
     }
   },
-  "packageManager": "pnpm@7.2.1",
+  "packageManager": "pnpm@8.11.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Kingwl/monaco-volar.git"
@@ -42,6 +42,7 @@
     "monaco-textmate": "^3.0.1",
     "path-browserify": "^1.0.1",
     "prettier": "^2.8.8",
+    "shiki": "^0.14.6",
     "typescript": "^5.1.3",
     "vite": "^4.3.9",
     "volar-service-typescript": "0.0.8",

src/grammars.ts

@@ -0,0 +1,68 @@
+import { wireTmGrammars } from "monaco-editor-textmate";
+import { Registry, type IGrammarDefinition } from "monaco-textmate";
+
+async function dispatchGrammars(
+  scopeName: string
+): Promise<IGrammarDefinition> {
+  switch (scopeName) {
+    case "source.vue":
+      return {
+        format: "json",
+        content: await import("shiki/languages/vue.tmLanguage.json"),
+      };
+    case "source.ts":
+      return {
+        format: "json",
+        content: await import("shiki/languages/typescript.tmLanguage.json"),
+      };
+    case "source.js":
+      return {
+        format: "json",
+        content: await import("shiki/languages/javascript.tmLanguage.json"),
+      };
+    case "text.html.basic":
+      return {
+        format: "json",
+        content: await import("shiki/languages/html.tmLanguage.json"),
+      };
+    case "source.css":
+      return {
+        format: "json",
+        content: await import("shiki/languages/css.tmLanguage.json"),
+      };
+    default:
+      return {
+        format: "json",
+        content: {
+          scopeName: "source",
+          patterns: [],
+        },
+      };
+  }
+}
+
+export async function loadGrammars(
+  monaco: typeof import("monaco-editor-core"),
+  editor: import("monaco-editor-core").editor.IStandaloneCodeEditor
+) {
+  const registry = new Registry({
+    getGrammarDefinition: async (scopeName) => {
+      const dispatch = await dispatchGrammars(scopeName);
+      return JSON.parse(JSON.stringify(dispatch));
+    },
+  });
+  const grammars = new Map();
+  grammars.set("vue", "source.vue");
+  grammars.set("javascript", "source.js");
+  grammars.set("typescript", "source.ts");
+  grammars.set("css", "source.css");
+  grammars.set("html", "text.html.basic");
+
+  for (const lang of grammars.keys()) {
+    monaco.languages.register({
+      id: lang,
+    });
+  }
+
+  await wireTmGrammars(monaco as any, registry, grammars, editor as any);
+}