Share My Creation [VS Code B4X IDE Companion]: Supercharging VS Code for B4X - How It Works & Why I Need It, You Might Too

Hello Fam!

Let's unbox (and perhaps build together) this monster to be, the B4X IDE Companion

Quickly get it from your VS Code Extensions

This has been generated with AI.

Source Code in GitHub

I've had myself into a pickle, I find myself using VSCode more with AI to work on my projects, so let's see this new B4X IntelliSense Extension for Visual Studio Code. It’s time to pull back the curtain. If you love the B4X framework (B4A, B4i, B4J, B4R) but want to leverage the massive ecosystem, layout, and speed of Visual Studio Code, this extension bridges the gap. bla bla bla bla...

This isn't just a basic syntax highlighter; it is a full-featured Language Server Protocol (LSP) integration that understands the B4X language structure. Here is a deep dive into what it does, how it works under the hood, and why it will revolutionize your workflow.

1. Smart Type Inference & Auto-Complete

Why use it: Writing code is much faster when your editor accurately predicts what properties, methods, and variables belong to the object you are typing.
How it works: The extension doesn't just guess; it actively reads your workspace and installation files to build a massive in-memory API index.

• XML & B4X Library Parsing: It parses the xml, b4xlib in your Libraries/Additional Libraries files directly from your B4A installation and configured additional folders. It decodes the XML nodes (like <class>, <method>, and <property>) into a searchable index.
• Workspace Scanning: It reads your .b4a project file to determine exactly which libraries and external shared modules your specific project uses.
• Inference Engine: As you type, the extension tracks your Dim, Public, and Private declarations, as well as Sub parameters, to constantly infer the types of your variables. When you type a dot (.), it resolves the known class and instantly provides accurate member completion.

2. Real-Time Code Diagnostics & "Quick Fixes"

Why use it: Catch compilation errors before you even hit compile, saving you round-trip debugging time.
How it works: The extension continuously analyzes your active document. For example, B4X requires Type declarations to be placed inside Sub Class_Globals or Sub Process_Globals. The extension's diagnostic engine scans your lines, detecting if a Type is declared outside of these specific subroutines. If it finds a misplaced type, it throws a warning and offers a Code Action (Quick Fix) that will literally edit your document to automatically move the Type block into the correct Globals subroutine. It also supports modern refactoring features like "Extract Method".

(In most cases where AI generates the code, usually it created the Type outside of these subroutines, some AI tools still miss this part. So far thats the only compilation error it fixes, I hope more can come.)

3. Native IDE Theme Importing

Why use it: You want the modern power of VS Code, but your eyes are perfectly accustomed to your customized B4X IDE colors.
How it works: The extension includes a .vssettings theme importer that reads directly from the Themes folder in your B4A installation. It parses the XML color data from the B4X theme and maps specific B4X scopes (like 'User Types - Methods' or 'Keyword') directly into VS Code's textMateRules and token color customizations. It seamlessly generates and applies a native VS Code .json theme file that matches your B4X environment perfectly.

4. Seamless "Main" Code Syncing

Why use it: B4X .b4a files mix UI designer metadata with basic code, making them messy to edit in standard text editors.
How it works: The extension safely separates the code from the metadata. It reads your .b4a file and extracts everything after the @EndOfDesignText@ marker, saving it into a temporary .b4x file in your workspace. You edit this clean .b4x file in VS Code. When you save, a file system watcher automatically syncs your newly written code back into the original .b4a file, safely preserving the designer metadata while keeping a timestamped backup just in case.

5. Integrated Building & Auto-Backups

Why use it: You can compile, install, and backup without leaving the VS Code window.
How it works:

• Auto-Backups: The extension reads your system-wide b4xV5.ini configuration. If AutoBackup is enabled, it spawns a hidden background PowerShell script that automatically backs up your B4A folder at the exact intervals specified in your INI file.
• Building: By running the b4xIntellisense.installProject command, the extension locates your B4ABuilder.exe and your adb.exe paths, and executes a PowerShell build script to compile and push your app directly to your device or emulator.

To Do

• Tick off some wishful thinking
• Tick off bugs discovered during unboxing
• Tick off AI intergration
• Tick off some other dreams...

THIS HAS BEEN FUN & PAINFUL... ha ha ha..

#SharingTheGoodness






Version 0.1.334

 

[mrserv0]

Hi Fam

Let's unbox (and perhaps build together) this monster to be.

View attachment 170662

Quickly get it from your VS Code Extensions

View attachment 170663

Hello Fam!

This has been generated with AI. For now it focuses on b4a, will adopt it for other frameworks soon.

I've had myself into a pickle, I find myself using VSCode more with AI to work on my projects, so let's see this new B4X IntelliSense Extension for Visual Studio Code. It’s time to pull back the curtain. If you love the B4X framework (B4A, B4i, B4J, B4R) but want to leverage the massive ecosystem, layout, and speed of Visual Studio Code, this extension bridges the gap. bla bla bla bla...

This isn't just a basic syntax highlighter; it is a full-featured Language Server Protocol (LSP) integration that understands the B4X language structure. Here is a deep dive into what it does, how it works under the hood, and why it will revolutionize your workflow.

1. Smart Type Inference & Auto-Complete

Why use it: Writing code is much faster when your editor accurately predicts what properties, methods, and variables belong to the object you are typing.
How it works: The extension doesn't just guess; it actively reads your workspace and installation files to build a massive in-memory API index.

• XML & B4X Library Parsing: It parses the xml, b4xlib in your Libraries/Additional Libraries files directly from your B4A installation and configured additional folders. It decodes the XML nodes (like <class>, <method>, and <property>) into a searchable index.
• Workspace Scanning: It reads your .b4a project file to determine exactly which libraries and external shared modules your specific project uses.
• Inference Engine: As you type, the extension tracks your Dim, Public, and Private declarations, as well as Sub parameters, to constantly infer the types of your variables. When you type a dot (.), it resolves the known class and instantly provides accurate member completion.

2. Real-Time Code Diagnostics & "Quick Fixes"

Why use it: Catch compilation errors before you even hit compile, saving you round-trip debugging time.
How it works: The extension continuously analyzes your active document. For example, B4X requires Type declarations to be placed inside Sub Class_Globals or Sub Process_Globals. The extension's diagnostic engine scans your lines, detecting if a Type is declared outside of these specific subroutines. If it finds a misplaced type, it throws a warning and offers a Code Action (Quick Fix) that will literally edit your document to automatically move the Type block into the correct Globals subroutine. It also supports modern refactoring features like "Extract Method".

(In most cases where AI generates the code, usually it created the Type outside of these subroutines, some AI tools still miss this part. So far thats the only compilation error it fixes, I hope more can come.)

3. Native IDE Theme Importing

Why use it: You want the modern power of VS Code, but your eyes are perfectly accustomed to your customized B4X IDE colors.
How it works: The extension includes a .vssettings theme importer that reads directly from the Themes folder in your B4A installation. It parses the XML color data from the B4X theme and maps specific B4X scopes (like 'User Types - Methods' or 'Keyword') directly into VS Code's textMateRules and token color customizations. It seamlessly generates and applies a native VS Code .json theme file that matches your B4X environment perfectly.

4. Seamless "Main" Code Syncing

Why use it: B4X .b4a files mix UI designer metadata with basic code, making them messy to edit in standard text editors.
How it works: The extension safely separates the code from the metadata. It reads your .b4a file and extracts everything after the @EndOfDesignText@ marker, saving it into a temporary .b4x file in your workspace. You edit this clean .b4x file in VS Code. When you save, a file system watcher automatically syncs your newly written code back into the original .b4a file, safely preserving the designer metadata while keeping a timestamped backup just in case.

5. Integrated Building & Auto-Backups

Why use it: You can compile, install, and backup without leaving the VS Code window.
How it works:

• Auto-Backups: The extension reads your system-wide b4xV5.ini configuration. If AutoBackup is enabled, it spawns a hidden background PowerShell script that automatically backs up your B4A folder at the exact intervals specified in your INI file.
• Building: By running the b4xIntellisense.installProject command, the extension locates your B4ABuilder.exe and your adb.exe paths, and executes a PowerShell build script to compile and push your app directly to your device or emulator.

To Do

• Tick off some wishful thinking
• Tick off bugs discovered during unboxing
• Tick off AI intergration
• Tick off some other dreams...

THIS HAS BEEN FUN & PAINFUL... ha ha ha..

#SharingTheGoodness

What was your biggest pain point with the B4X extension by Jansen? It's hard to hear from the audio. the other one seems to cover most bases! Love your work btw

 

[Mashiane]

What was your biggest pain point with the B4X extension by Jansen?

Hi, I have not used Jansen's extension as yet. I did take a look a peek at his github repo though after, I coded mine and it is interesting and his is more simpler.

My initial thought about my extension was to make it dynamic, it should be able to build intellisense based on existing xml and b4xlibs (both internal & external libraries folder) and also including shared folders. It should also be able to build intellisense based on existing bas files in your project e.g. you have classes and code modules. I have custom view "classes" and static code modules that are referenced in my demo. So being able to have my custom views code showing up in intellisense when checking my demos was my ultimate goal.

I've also updated it now to work with b4j project files as I needed to ensure that b4a files work properly.

Its been an interesting learning curve anyway. Some kind of bucket-list tick off thing for me.

Ta!

 

[Sandman]

This isn't just a basic syntax highlighter; it is a full-featured Language Server Protocol (LSP) integration that understands the B4X language structure.

Can you explain on bit what this actually means? As we all know, B4X natively doesn't support LSP, what have you done to make your own LSP?

 

[thetrueman]

This is wonderful... if it happens then it is same as effective as after AI the scene has been changed in every aspect for developers... great to see further pain outcome. Thanks.

 

[Mashiane]

Hi Fam!

A new version has been released, works with all platforms now, b4a, b4i, b4j and b4r.

Test it out and send word of your "wishes" and or bug reports. Please ensure you backup your project.

Important Note

You need to open a platform project first, the extension WILL NEVER WORK if you just open a single .bas file, it's not built for that.

Why? It scans your platform project file for all Modules & Libraries and only loads those to intellisense. It shows the progress of doing this on the bottom left status bar.

Ensure its "Ready" before you use.

Remember, this is just a companion tool (due to AI Agentic coding in VS Code), it's not a replacement of the b4x IDEs.

To access commands go to View > Command Pallete and type B4x...

#SharingTheGoodness

 

[Mashiane]

Version 0.1.318 is out.

• Bug Fixes
• Enhancements

Activation Bar icon to get access to extension functionalities.

 

[Mashiane]

Upcoming Updates

B4x Library Browser with full text search and filtering..

ReadMe

Forum

Library Modal

Related Content

[B4X] VSCode IDE Companion: Mastering B4x Libraries Browser

Hi Fam The VSCode IDE Companion library browser has been built using Erels Github Libraries Mapping JSON file. To access it, one clicks the B4X Library Browser. A nice filter also exists by platform, by library type and name. One of the thing that is lovely about this JSON file is that it has...

www.b4x.com

 

[Mashiane]

Version 0.1.334 is now available...

What's New...

 

[Mashiane]

An Intellisense HealthCheck has been added..

This confirms what has been loaded to Intellisense. Use this in case you have issues with Intellisense.

Intellisense works with the project you have opened.

 

[MichalK73]

Is the extension prepared for Windows or will it work under Linux as well?

 

[mcqueccu]

Is the extension prepared for Windows or will it work under Linux as well?

Its running inside vscode, so far as VSCode support windows, linux and Mac, you can install the extension

 

[MichalK73]

Its running inside vscode, so far as VSCode support windows, linux and Mac, you can install the extension

I know that.
But under Linux, you don't have java.exe to compile; you have Java without the .exe extension.

You should be able to distinguish the system and run the appropriate Java.

 

[MichalK73]

An Intellisense HealthCheck has been added..

This confirms what has been loaded to Intellisense. Use this in case you have issues with Intellisense.

Intellisense works with the project you have opened.

View attachment 171725

=== B4X IntelliSense Health ===
Extension: v0.1.390
Time: 6/2/2026, 11:14:31 AM
LSP Server: Not started
Project File: abmlotto.b4j
Module Files: 18 indexed
Module Classes: 18 available
B4J Install Path: c:\b4x\B4J\
Internal Libraries Folder: C:\b4x\B4J\Libraries
Additional Libraries Folder: Not configured
Shared Modules Folder: Not configured
Tools Folder: Not configured
JavaBin: Not configured
Platform Folder: Not configured
New Project Default Folder: Not configured
XML Files: 5 loaded
XML Classes: 40 available
B4XLib Files: 0 processed
B4XLib Modules: 0 extracted
B4XLib Reference Modules: 0 indexed
B4XLib Reference Classes: 0 available
Common Class: 92 members
Active Editor: None
=== End ===

After updating the plugin to the latest one, I now have these errors

B4X LSP server failed to start: Error: Cannot find module 'vscode-languageserver-protocol'
Require stack:
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\common\server.js
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\node\main.js
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\server\server.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1390:15)
    at defaultResolveImpl (node:internal/modules/cjs/loader:1032:19)
    at resolveForCJSWithHooks (node:internal/modules/cjs/loader:1037:22)
    at Module._load (node:internal/modules/cjs/loader:1199:37)
    at c._load (node:electron/js2c/node_init:2:18041)
    at TracingChannel.traceSync (node:diagnostics_channel:328:14)
    at wrapModuleLoad (node:internal/modules/cjs/loader:244:24)
    at Module.require (node:internal/modules/cjs/loader:1470:12)
    at require (node:internal/modules/helpers:147:16)
    at Object.<anonymous> (c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\common\server.js:8:42)
[Error - 11:27:23 AM] Server initialization failed.
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] The B4X Language Server server crashed 5 times in the last 3 minutes. The server will not be restarted. See the output for more information.
[Error - 11:27:23 AM] B4X Language Server client: couldn't create connection to server.
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] Restarting server failed
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] Server process exited with code 1.

 

[Sandman]

Can you explain on bit what this actually means? As we all know, B4X natively doesn't support LSP, what have you done to make your own LSP?

I'm still curious about this.

 

[Mashiane]

Is the extension prepared for Windows or will it work under Linux as well?

I do not have a linux setup.

 

[Mashiane]

=== B4X IntelliSense Health ===
Extension: v0.1.390
Time: 6/2/2026, 11:14:31 AM
LSP Server: Not started
Project File: abmlotto.b4j
Module Files: 18 indexed
Module Classes: 18 available
B4J Install Path: c:\b4x\B4J\
Internal Libraries Folder: C:\b4x\B4J\Libraries
Additional Libraries Folder: Not configured
Shared Modules Folder: Not configured
Tools Folder: Not configured
JavaBin: Not configured
Platform Folder: Not configured
New Project Default Folder: Not configured
XML Files: 5 loaded
XML Classes: 40 available
B4XLib Files: 0 processed
B4XLib Modules: 0 extracted
B4XLib Reference Modules: 0 indexed
B4XLib Reference Classes: 0 available
Common Class: 92 members
Active Editor: None
=== End ===
View attachment 171732
View attachment 171733

After updating the plugin to the latest one, I now have these errors

B4X LSP server failed to start: Error: Cannot find module 'vscode-languageserver-protocol'
Require stack:
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\common\server.js
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\node\main.js
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\server\server.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1390:15)
    at defaultResolveImpl (node:internal/modules/cjs/loader:1032:19)
    at resolveForCJSWithHooks (node:internal/modules/cjs/loader:1037:22)
    at Module._load (node:internal/modules/cjs/loader:1199:37)
    at c._load (node:electron/js2c/node_init:2:18041)
    at TracingChannel.traceSync (node:diagnostics_channel:328:14)
    at wrapModuleLoad (node:internal/modules/cjs/loader:244:24)
    at Module.require (node:internal/modules/cjs/loader:1470:12)
    at require (node:internal/modules/helpers:147:16)
    at Object.<anonymous> (c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\common\server.js:8:42)
[Error - 11:27:23 AM] Server initialization failed.
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] The B4X Language Server server crashed 5 times in the last 3 minutes. The server will not be restarted. See the output for more information.
[Error - 11:27:23 AM] B4X Language Server client: couldn't create connection to server.
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] Restarting server failed
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] Server process exited with code 1.

Let me try and reproduce the error and find a solution. Thanks for pointing this out. Appreciated.

 

[Mashiane]

Found the issue...

Current approach: .vscodeignore uses a fragile blacklist pattern — exclude all node_modules/**, then selectively re-include only the packages you think are needed. When a transitive dependency is missed (like
vscode-languageserver-protocol), the deployed VSIX crashes silently — you only discover it when a user reports the error.

This is compounded by:
- The esbuild config marks vscode-languageserver as external but doesn't track its transitive deps
- CI used --no-dependencies, bypassing vsce's dependency resolution entirely
- No automated validation that the packaged VSIX has everything it needs

Let me ensure that I have some validation gates added here to ensure this does not happen again..

 

[Herbert32]

B4X LSP server failed to start: Error: Cannot find module 'vscode-languageserver-protocol'
Require stack:
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\common\server.js
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\node\main.js
- c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\server\server.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1390:15)
    at defaultResolveImpl (node:internal/modules/cjs/loader:1032:19)
    at resolveForCJSWithHooks (node:internal/modules/cjs/loader:1037:22)
    at Module._load (node:internal/modules/cjs/loader:1199:37)
    at c._load (node:electron/js2c/node_init:2:18041)
    at TracingChannel.traceSync (node:diagnostics_channel:328:14)
    at wrapModuleLoad (node:internal/modules/cjs/loader:244:24)
    at Module.require (node:internal/modules/cjs/loader:1470:12)
    at require (node:internal/modules/helpers:147:16)
    at Object.<anonymous> (c:\Users\biosk\.vscode\extensions\anelembangamashy.b4x-intellisense-0.1.390\node_modules\vscode-languageserver\lib\common\server.js:8:42)
[Error - 11:27:23 AM] Server initialization failed.
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] The B4X Language Server server crashed 5 times in the last 3 minutes. The server will not be restarted. See the output for more information.
[Error - 11:27:23 AM] B4X Language Server client: couldn't create connection to server.
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] Restarting server failed
  Message: Pending response rejected since connection got disposed
  Code: -32097
[Error - 11:27:23 AM] Server process exited with code 1.

I also have the Problem that LSP-Server does not start - how can I receive such a detailed Debug-Log?

 

[Mashiane]

B4X LSP server failed to start: Error: Cannot find module 'vscode-languageserver-protocol'

Please lets not post any more issues about the LSP server at the moment. I am currently investigating this issue further above and beyond the found solution because currently the vsix does not run in a sandboxed environment.

As soon as I have a real working solution I will update you. I kindly request a little patience.

Latest...

A notification will now show when the LSP Server is started and indexing bas files.