Confusing bundling options & extension files

[kristiannotari]

Hello everyone,

loving the ease of use of langium and how it's going to simplify my idea-to-dsl projects. I started a new one recently and followed the tutorials and guides on your website. I admin I have basically no experience with developing language servers and vscode extensions but I find confusing the two different approaches to bundling one can read in the code bundling section and in the building an extension section. It appears to me two different ways of doing (almost) the same thing are described (speaking about the sole esbuild part).

Moreover, I'd like to ask how these two concepts depends on each other cause that's not clear to me after reading through the guides:

• the main.ts file with the language server initialitation
• the extension.ts file with the vscode extension code

Speaking about having a "mylanguage" project, I'd like to separate my core language code (grammar, validation, generation) from the extension code and from the cli code and I'm not sure how those files relate one another when such a division should occur.

Thanks in advance,
Kristian

[msujew]

Hey @kristiannotari, thanks for the question.

So basically, the building an extension tutorial assumes that one has already read the code bundling guide. The code bundling guide goes more in depth about why code bundling (i.e. the process of creating just a single standalone JavaScript file) in the context of Langium is useful or maybe even necessary, and how one can accomplish this using different setups. For example in a vscode extension where you need to bundle both the language server (main.ts) and the extension itself (extension.ts), or for webworkers, where you need special bundling options.

The building an extension tutorial is more about the surrounding infrastructure - i.e. how do I set an icon, create a .vsix file and install that in any vscode instance.

I'd like to separate my core language code (grammar, validation, generation) from the extension code and from the cli code and I'm not sure how those files relate one another when such a division should occur.

From an architectural point of view, extension and language code are recommended to be split into two separate processes. Language servers (such as one built using Langium) are designed to run in a separate process (or at least separate thread). This is the main reason why we recommend to build two separate bundles - so that your project has two entry points. One is the entry point for vscode to start your extension. The other is called by your extension to start the language server.

If you want to have a more sophisticated project setup, it might make even sense to split the language server and extension into separate packages. We've done so for the core langium repo (the grammar language itself is written using Langium). See in there the langium directory which contains the language and the langium-vscode directory which only contains the vscode extension. You need some sort of workspace management solution to link the packages together like npm workspaces.

[kristiannotari]

Thanks for the answer! Yeah I've already done a monorepo setup with pnpm workspaces cause I'll need several packages and utilities out of the "core" language one and, since I was there, I wanted to split the cli and vscode extension too.

So from what I can understand reading your answer, the vscode extension needs both the extension entry point and the main entry point. One basically gives some context to the extension and start the client, which will connect to the language server being spawned in main? Is this a convention in naming files and exports of such files for vscode extensions or what? New to vscode extension, sorry for asking.

So for the bundling bit, if I just copy/paste the bundling solution provided in the "building an extension" page nothing would work (if I've understood you correctly) cause that way I would be bundling the extension file only, without the language server (as of the code generated by yeoman generator for the tutorial), right?

[spoenemann]

Note: Microsoft's documentation for creating VS Code extensions is very good!
https://code.visualstudio.com/api/working-with-extensions/bundling-extension