ERROR TypeError: module2.LanguageClient is not a constructor

[maximstewart]

As the title says, I am getting a constructor error when trying to use ace-linters. I've tried both with the client as well as web worker and both throw same error. I'm using this in conjunction with Angular & Electron if that matters. I do an ng build && electron . when running the app and it fails. When running with ng serve and bypassing some file loading logic that I have for electron I do get completions or at least no errors.

Node / npm version

node --version  =  v23.9.0
npm --version   =  10.9.0

Packge Versions

        "@angular/cli": "19.2.9",
        "@angular/common": "19.2.0",
        "@angular/compiler": "19.2.0",
        "@angular/core": "19.2.0",
        "@angular/forms": "19.2.0",
        "@angular/platform-browser": "19.2.0",
        "@angular/platform-browser-dynamic": "19.2.0",
        "@angular/platform-server": "19.2.0",
        "@angular/router": "19.2.0",
        "ace-builds": "1.41.0",
        "ace-linters": "1.5.3",
        "bootstrap": "5.3.6",
        "bootstrap-icons": "1.12.1",
        "express": "4.18.2",
        "rxjs": "7.8.0",
        "tslib": "2.3.0",
        "uuid": "11.1.0",
        "zone.js": "0.15.0"

Client Setup

    let servers: LanguageClientConfig[] = [
        {
            module: () => import("ace-linters/build/language-client"),
            modes: "python",
            type: "socket",
            socket: new WebSocket("ws://127.0.0.1:9999/?name=pylsp"),
            initializationOptions: this.lspConfigData["python"]["initialization-options"]
        }
    ];

    return AceLanguageClient.for(servers);

or Webworker Setup

    My webworker.ts is copied from the README example listing all register service options.
    I modified the python setup to match my client style like above ^.

From typescript:

    let worker = new Worker(new URL('./webworker.js', import.meta.url));
    return LanguageProvider.create(worker);

The Worker:

    import {ServiceManager} from "ace-linters/build/service-manager";

    let manager = new ServiceManager(self);

   ...

    manager.registerServer("pythonls", {
        module: () => import("ace-linters/build/language-client"),
        modes: "python",
        type: "socket",
        socket: new WebSocket("ws://127.0.0.1:9999/?name=pylsp")
    });

    ...

Trace

ERROR TypeError: module2.LanguageClient is not a constructor
    at ServiceManager.<anonymous> (main.js:50646:53)
    at Generator.next (<anonymous>)
    at fulfilled (chunk-DAU4QTJP.js:59:24)
    at _ZoneDelegate.invoke (polyfills.js:301:158)
    at Object.onInvoke (main.js:70029:25)
    at _ZoneDelegate.invoke (polyfills.js:301:46)
    at ZoneImpl.run (polyfills.js:97:35)
    at polyfills.js:2005:30
    at _ZoneDelegate.invokeTask (polyfills.js:327:171)
    at main.js:69809:49
handleError @ main.js:70134
next @ main.js:86605
next @ main.js:63397
_next @ main.js:63366
next @ main.js:63339
(anonymous) @ main.js:63767
errorContext @ main.js:63308
next @ main.js:63760
emit @ main.js:69712
(anonymous) @ main.js:70060
invoke @ polyfills.js:301
run @ polyfills.js:97
runOutsideAngular @ main.js:69954
onHandleError @ main.js:70060
handleError @ polyfills.js:304
runGuarded @ polyfills.js:108
api.microtaskDrainDone @ polyfills.js:1837
drainMicroTaskQueue @ polyfills.js:488
Promise.then
nativeScheduleMicroTask @ polyfills.js:462
scheduleMicroTask @ polyfills.js:469
scheduleTask @ polyfills.js:319
onScheduleTask @ main.js:69804
scheduleTask @ polyfills.js:312
onScheduleTask @ polyfills.js:229
scheduleTask @ polyfills.js:312
scheduleTask @ polyfills.js:174
scheduleMicroTask @ polyfills.js:189
scheduleResolveOrReject @ polyfills.js:1997
resolvePromise @ polyfills.js:1951
(anonymous) @ polyfills.js:1881
(anonymous) @ polyfills.js:1895
Promise.then
(anonymous) @ polyfills.js:2221
ZoneAwarePromise @ polyfills.js:2160
Ctor.then @ polyfills.js:2220
resolvePromise @ polyfills.js:1923
resolve @ polyfills.js:2024
step @ chunk-DAU4QTJP.js:71
(anonymous) @ chunk-DAU4QTJP.js:72
ZoneAwarePromise @ polyfills.js:2160
__async @ chunk-DAU4QTJP.js:56
$initServiceInstance @ main.js:50641
(anonymous) @ main.js:50677
(anonymous) @ chunk-DAU4QTJP.js:72
ZoneAwarePromise @ polyfills.js:2160
__async @ chunk-DAU4QTJP.js:56
initializeService @ main.js:50673
(anonymous) @ main.js:50667
(anonymous) @ chunk-DAU4QTJP.js:72
ZoneAwarePromise @ polyfills.js:2160
__async @ chunk-DAU4QTJP.js:56
$getServicesInstancesByMode @ main.js:50661
(anonymous) @ main.js:50713
(anonymous) @ chunk-DAU4QTJP.js:72
ZoneAwarePromise @ polyfills.js:2160
__async @ chunk-DAU4QTJP.js:56
addDocument @ main.js:50709
(anonymous) @ main.js:50605
(anonymous) @ chunk-DAU4QTJP.js:72
ZoneAwarePromise @ polyfills.js:2160
__async @ chunk-DAU4QTJP.js:56
getServicesCapabilitiesAfterCallback @ main.js:50604
(anonymous) @ main.js:50936
(anonymous) @ chunk-DAU4QTJP.js:72
ZoneAwarePromise @ polyfills.js:2160
__async @ chunk-DAU4QTJP.js:56
(anonymous) @ main.js:50876
emit @ main.js:45007
postMessage @ main.js:62563
postMessage @ main.js:59835
init @ main.js:59766
$init @ main.js:62255
SessionLanguageProvider @ main.js:62528
(anonymous) @ main.js:62212
(anonymous) @ main.js:61981
EventEmitter2._signal @ main.js:749
Editor2.setSession @ main.js:13659
(anonymous) @ main.js:104035
invoke @ polyfills.js:301
onInvoke @ main.js:70029
invoke @ polyfills.js:301
run @ polyfills.js:97
(anonymous) @ polyfills.js:2005
invokeTask @ polyfills.js:327
(anonymous) @ main.js:69809
onInvokeTask @ main.js:69809
invokeTask @ polyfills.js:327
onInvokeTask @ main.js:70018
invokeTask @ polyfills.js:327
runTask @ polyfills.js:135
drainMicroTaskQueue @ polyfills.js:482
Zone - Promise.then
onScheduleTask @ main.js:69803
scheduleTask @ polyfills.js:312
onScheduleTask @ polyfills.js:229
scheduleTask @ polyfills.js:312
scheduleTask @ polyfills.js:174
scheduleMicroTask @ polyfills.js:189
scheduleResolveOrReject @ polyfills.js:1997
resolvePromise @ polyfills.js:1951
(anonymous) @ polyfills.js:1881
(anonymous) @ polyfills.js:1895
step @ chunk-DAU4QTJP.js:71
fulfilled @ chunk-DAU4QTJP.js:59
invoke @ polyfills.js:301
onInvoke @ main.js:70029
invoke @ polyfills.js:301
run @ polyfills.js:97
(anonymous) @ polyfills.js:2005
invokeTask @ polyfills.js:327
(anonymous) @ main.js:69809
onInvokeTask @ main.js:69809
invokeTask @ polyfills.js:327
onInvokeTask @ main.js:70018
invokeTask @ polyfills.js:327
runTask @ polyfills.js:135
drainMicroTaskQueue @ polyfills.js:482
Zone - Promise.then
onScheduleTask @ main.js:69803
scheduleTask @ polyfills.js:312
onScheduleTask @ polyfills.js:229
scheduleTask @ polyfills.js:312
scheduleTask @ polyfills.js:174
scheduleMicroTask @ polyfills.js:189
scheduleResolveOrReject @ polyfills.js:1997
resolvePromise @ polyfills.js:1951
(anonymous) @ polyfills.js:1881
(anonymous) @ polyfills.js:1895
step @ chunk-DAU4QTJP.js:71
fulfilled @ chunk-DAU4QTJP.js:59
invoke @ polyfills.js:301
onInvoke @ main.js:70029
invoke @ polyfills.js:301
run @ polyfills.js:97
(anonymous) @ polyfills.js:2005
invokeTask @ polyfills.js:327
(anonymous) @ main.js:69809
onInvokeTask @ main.js:69809
invokeTask @ polyfills.js:327
onInvokeTask @ main.js:70018
invokeTask @ polyfills.js:327
runTask @ polyfills.js:135
drainMicroTaskQueue @ polyfills.js:482
Zone - Promise.then
onScheduleTask @ main.js:69803
scheduleTask @ polyfills.js:312
onScheduleTask @ polyfills.js:229
scheduleTask @ polyfills.js:312
scheduleTask @ polyfills.js:174
scheduleMicroTask @ polyfills.js:189
scheduleResolveOrReject @ polyfills.js:1997
resolvePromise @ polyfills.js:1951
(anonymous) @ polyfills.js:1881
(anonymous) @ polyfills.js:1895
invoke @ polyfills.js:301
onInvoke @ main.js:70029
invoke @ polyfills.js:301
run @ polyfills.js:97
(anonymous) @ polyfills.js:2005
invokeTask @ polyfills.js:327
(anonymous) @ main.js:69809
onInvokeTask @ main.js:69809
invokeTask @ polyfills.js:327
onInvokeTask @ main.js:70018
invokeTask @ polyfills.js:327
runTask @ polyfills.js:135
drainMicroTaskQueue @ polyfills.js:482
Zone - Promise.then
onScheduleTask @ main.js:69803
scheduleTask @ polyfills.js:312
onScheduleTask @ polyfills.js:229
scheduleTask @ polyfills.js:312
scheduleTask @ polyfills.js:174
scheduleMicroTask @ polyfills.js:189
scheduleResolveOrReject @ polyfills.js:1997
resolvePromise @ polyfills.js:1951
(anonymous) @ polyfills.js:1881
(anonymous) @ polyfills.js:1895
Promise.then
(anonymous) @ polyfills.js:2221
ZoneAwarePromise @ polyfills.js:2160
Ctor.then @ polyfills.js:2220
resolvePromise @ polyfills.js:1923
resolve @ polyfills.js:2024
step @ chunk-DAU4QTJP.js:71
(anonymous) @ chunk-DAU4QTJP.js:72
ZoneAwarePromise @ polyfills.js:2160
__async @ chunk-DAU4QTJP.js:56
addFile @ main.js:104054
(anonymous) @ main.js:104047
(anonymous) @ chunk-DAU4QTJP.js:72
ZoneAwarePromise @ polyfills.js:2160
__async @ chunk-DAU4QTJP.js:56
loadFilesList @ main.js:104039
onFileDropped @ main.js:104031
EditorsComponent_Template_div_fileDropped_1_listener @ main.js:104100
executeListenerWithErrorHandling @ main.js:83706
wrapListenerIn_markDirtyAndPreventDefault @ main.js:83726
next @ main.js:63397
_next @ main.js:63366
next @ main.js:63339
(anonymous) @ main.js:63767
errorContext @ main.js:63308
next @ main.js:63760
emit @ main.js:69712
ondrop @ main.js:103772
DndDirective_drop_HostBindingHandler @ main.js:103787
executeListenerWithErrorHandling @ main.js:83706
wrapListenerIn_markDirtyAndPreventDefault @ main.js:83726
(anonymous) @ main.js:96676
invokeTask @ polyfills.js:327
(anonymous) @ main.js:69809
onInvokeTask @ main.js:69809
invokeTask @ polyfills.js:327
onInvokeTask @ main.js:70018
invokeTask @ polyfills.js:327
runTask @ polyfills.js:135
invokeTask @ polyfills.js:398
invokeTask @ polyfills.js:924
globalCallback @ polyfills.js:945
globalZoneAwareCallback @ polyfills.js:970

[maximstewart]

Trying to add some more context/info and this is the state at breakpoint:

[mkslanc]

I'll check today

[mkslanc]

Not sure, what is exactly wrong with your setup, but I managed to run it with angular and electron

Configs could be wrong, Angular is out of my expertise actually.

Here is example

[maximstewart]

Okay, going through your example, I noticed that the angular.json file has the build setup to be:

                    "builder": "@angular-devkit/build-angular:browser",
...
                    "main": "src/main.ts",

whereas mine is setup to be:

                    "builder":"@angular-devkit/build-angular:application",
...
                    "browser":"src/main.ts",

after pretty much literally copying every other config of yours that one change is the one that's gotten me progress.

Here's my repo sans the build changes and keeping it as the one that has Ace throw the error:

https://code.itdominator.com/itdominator/ace-angular-electron