Language server

.eslintrc.json

@@ -3,12 +3,12 @@
   "parserOptions": {
     "ecmaVersion": 12,
     "sourceType": "module",
-    "project": ["src/tsconfig.json"]
+    "project": ["server/tsconfig.json", "client/tsconfig.json"]
   },
   "plugins": ["@typescript-eslint"],
   "env": {
     "browser": false,
-    "es2021": true
+    "es2022": true
   },
   "extends": [
     "eslint:recommended",
@@ -169,7 +169,7 @@
     "no-script-url": "error",
     "no-self-compare": "error",
     "no-sequences": "error",
-    "no-shadow": "error",
+    "@typescript-eslint/no-shadow": "error",
     "no-shadow-restricted-names": "error",
     "no-spaced-func": "error",
     "no-sync": "error",
@@ -184,7 +184,7 @@
     "no-unmodified-loop-condition": "error",
     "no-unneeded-ternary": "error",
     "no-unused-expressions": "error",
-    "no-unused-vars": "error",
+    "@typescript-eslint/no-unused-vars": "error",
     "no-use-before-define": "off",
     "no-useless-call": "error",
     "no-useless-computed-key": "error",

.gitignore

@@ -6,3 +6,5 @@ dist
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+.vscode/settings.json
+package-lock.json

.vscode/launch.json

@@ -1,16 +1,30 @@
 {
   "version": "0.2.0",
+
+  "compounds": [
+    {
+      "name": "Server/Client",
+      "configurations": ["Attach to Server", "Launch Extension"],
+      "stopAll": true
+    }
+  ],
   "configurations": [
     {
-      "args": [
-        "--extensionDevelopmentPath=${workspaceFolder}"
-      ],
+      "name": "Attach to Server",
+      "port": 6009,
+      "request": "attach",
+      "skipFiles": ["<node_internals>/**"],
+      "type": "node"
+    },
+    {
+      "args": ["--extensionDevelopmentPath=${workspaceFolder}"],
       "name": "Launch Extension",
       "outFiles": [
-        "${workspaceFolder}/dist/**/*.js"
+        "${workspaceFolder}/client/dist/**/*.js",
+        "${workspaceFolder}/server/dist/**/*.js"
       ],
       "request": "launch",
       "type": "extensionHost"
     }
   ]
-}
+}

client/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "d2-extension-client",
+  "displayName": "D2",
+  "publisher": "Terrastruct",
+  "description": "Support for .d2 files.",
+  "version": "0.8.7",
+  "license": "BSD-3-Clause",
+  "contributors": [
+    "Barry Nolte <[email protected]>"
+  ],
+  "engines": {
+    "vscode": "^1.73.0"
+  },
+  "devDependencies": {
+    "@types/glob": "^8.1.0",
+    "@types/markdown-it-container": "^2.0.8",
+    "@types/mocha": "^10.0.3",
+    "@types/node": "^20.8.10",
+    "@types/vscode": "^1.84.0",
+    "@typescript-eslint/eslint-plugin": "^6.9.1",
+    "@typescript-eslint/parser": "^6.9.1",
+    "@vscode/test-electron": "^2.3.6",
+    "@vscode/vsce": "^2.22.0",
+    "eslint": "^8.53.0",
+    "eslint-config-prettier": "^8.6.0",
+    "eslint-formatter-pretty": "^4.1.0",
+    "eslint-webpack-plugin": "^4.0.1",
+    "glob": "^10.3.10",
+    "mocha": "^10.2.0",
+    "prettier": "^2.8.3",
+    "ts-loader": "^9.5.0",
+    "typescript": "^5.2.2",
+    "webpack": "^5.89.0",
+    "webpack-cli": "^5.1.4"
+  },
+  "dependencies": {
+    "markdown-it-container": "^3.0.0",
+    "path": "^0.12.7",
+    "vscode-languageclient": "^9.0.1"
+  },
+  "homepage": "https://d2lang.com",
+  "icon": "d2-icon.png",
+  "bugs": {
+    "url": "https://github.com/terrastruct/d2-vscode/issues",
+    "email": "[email protected]"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/terrastruct/d2-vscode"
+  }
+}

src/docToPreviewGenerator.ts → client/src/docToPreviewGenerator.ts

@@ -89,7 +89,17 @@ export class DocToPreviewGenerator {
 
         let list = "";
         arr.forEach((s) => {
-          list += `<li>${s}</li>`;
+          if (s.length > 0) {
+            /*
+              Matches: "error:0:0: message" or
+                       "warning:100:20:explaination"
+            */
+            const rg = new RegExp(/^(.*?):(\d+):(\d+):(\s+)(.*)$/g).exec(s);
+            const msg = rg !== null ? rg[5] : s;
+            const line = rg ? rg[2] || "0" : "0";
+            const col = rg ? rg[3] || "0" : "0";
+            list += `<li>${msg}  (${line}:${col})</li>`;
+          }
         });
 
         trkObj.outputDoc?.setToastMsg("Errors");

src/extension.ts → client/src/extension.ts

@@ -27,10 +27,18 @@ import { d2Tasks } from "./tasks";
 import { util } from "./utility";
 import path = require("path");
 import { TextEncoder } from "util";
+import {
+  LanguageClient,
+  LanguageClientOptions,
+  ServerOptions,
+  TransportKind,
+} from "vscode-languageclient/node";
 
 const d2Ext = "d2";
 const d2Lang = "d2";
+const pluginKeyword = "d2";
 const previewGenerator: DocToPreviewGenerator = new DocToPreviewGenerator();
+let langClient: LanguageClient;
 
 export const d2ConfigSection = "D2";
 export let ws: WorkspaceConfiguration = workspace.getConfiguration(d2ConfigSection);
@@ -236,6 +244,8 @@ export function activate(context: ExtensionContext): any {
     util.checkForD2Install();
   }
 
+  startLanguageServer();
+
   // Return our markdown renderer
   return {
     // Sets up our ability to render for markdown files
@@ -246,10 +256,63 @@ export function activate(context: ExtensionContext): any {
   };
 }
 
-const pluginKeyword = "d2";
+/**
+ * This starts the D2 Language Server
+ */
+function startLanguageServer(): void {
+  // The server is implemented in node
+  const serverModule = extContext.asAbsolutePath(
+    path.join("server", "dist", "server.js")
+  );
+  // The debug options for the server
+  // --inspect=6009: runs the server in Node's Inspector mode so VS Code can attach to the server for debugging
+  const debugOptions = { execArgv: ["--nolazy", "--inspect=6009"] };
+
+  // If the extension is launched in debug mode then the debug server options are used
+  // Otherwise the run options are used
+  const serverOptions: ServerOptions = {
+    run: {
+      module: serverModule,
+      transport: TransportKind.ipc,
+    },
+    debug: {
+      module: serverModule,
+      transport: TransportKind.ipc,
+      options: debugOptions,
+    },
+  };
+
+  const clientOptions: LanguageClientOptions = {
+    // Register the server for D2 documents
+    documentSelector: [{ scheme: "file", language: d2Lang }],
+    synchronize: {
+      configurationSection: d2ConfigSection,
+    },
+  };
+
+  // Create the language client and start the client.
+  langClient = new LanguageClient(
+    "D2LanguageServer",
+    "D2-Language Server",
+    serverOptions,
+    clientOptions
+  );
+
+  langClient.start();
+}
+
+/**
+ * Checks to see if the language server is up and running
+ * so features can be turned on/off appropriately
+ */
+export function isLanguageServerRunning(): boolean {
+  if (langClient.initializeResult === undefined) {
+    return false;
+  }
+  return true;
+}
 
 /**
- *
  * This function will be asked by the Markdown system to render
  * a d2 snippit in a markdown file
  */

src/refreshTimer.ts → client/src/refreshTimer.ts

@@ -13,7 +13,7 @@ import { ws } from "./extension";
 type TimerCallback = () => void;
 
 export class RefreshTimer {
-  timerId?: NodeJS.Timer;
+  timerId?: NodeJS.Timeout;
   callback: TimerCallback;
   interval = 0;
 

src/taskRunner.ts → client/src/taskRunner.ts

@@ -11,7 +11,7 @@ import {
   tasks,
   TaskScope,
 } from "vscode";
-import { outputChannel } from "./extension";
+import { isLanguageServerRunning, outputChannel } from "./extension";
 import { d2Tasks } from "./tasks";
 
 // eslint-disable-next-line no-unused-vars
@@ -41,7 +41,9 @@ export class TaskRunner {
       "D2 Task",
       "D2 Extension",
       ce,
-      ["$D2Matcher"]
+      // If the languange server is not running, fall back to the
+      // standard problem matcher
+      isLanguageServerRunning() ? undefined : ["$D2Matcher"]
     );
 
     task.presentationOptions = {

src/tasks.ts → client/src/tasks.ts

@@ -42,6 +42,9 @@ class D2Tasks {
       filePath = undefined;
     }
 
+    // Note: if env: is not specified, then process.env
+    // is the default, if anything is specified for env:,
+    // then process.env is not included (good bye path).
     const proc = spawnSync(d2Path, args, {
       cwd: filePath,
       input: text,

client/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "compilerOptions": {
+    "strict": true,
+    "module": "commonjs",
+    "target": "es2022",
+    "lib": ["es2022"],
+    "esModuleInterop": false,
+    "sourceMap": true,
+    "outDir": "dist",
+    "rootDir": "src",
+    "declaration": true,
+  },
+	"include": ["src"],
+	"exclude": ["node_modules"]
+
+}

webpack.config.js → client/webpack.config.js

@@ -9,13 +9,13 @@ const path = require("path");
 
 /** @type WebpackConfig */
 const extensionConfig = {
-  target: "node", // VS Code extensions run in a Node.js-context 📖 -> https://webpack.js.org/configuration/node/
+  target: "node", // VS Code extensions run in a Node.js-context -> https://webpack.js.org/configuration/node/
   mode: "none", // this leaves the source code as close as possible to the original (when packaging we set this to 'production')
 
-  entry: "./src/extension.ts", // the entry point of this extension, 📖 -> https://webpack.js.org/configuration/entry-context/
+  entry: "./client/src/extension.ts",
   output: {
-    // the bundle is stored in the 'dist' folder (check package.json), 📖 -> https://webpack.js.org/configuration/output/
-    path: path.resolve(__dirname, "dist"),
+    // the bundle is stored in the 'dist' folder (check package.json), -> https://webpack.js.org/configuration/output/
+    path: path.resolve(__dirname, "../dist"),
     filename: "extension.js",
     libraryTarget: "commonjs2",
   },
@@ -24,7 +24,7 @@ const extensionConfig = {
     // modules added here also need to be added in the .vscodeignore file
   },
   resolve: {
-    // support reading TypeScript and JavaScript files, 📖 -> https://github.com/TypeStrong/ts-loader
+    // support reading TypeScript and JavaScript files, -> https://github.com/TypeStrong/ts-loader
     extensions: [".ts", ".js"],
   },
   module: {