0

I'm trying to integrate Theia editor directly into an existing Electron app for nearly a week without success. All the Electron examples show running Theia standalone but not how to integrate it into an existing Electron app.

theia build command generates a lib folder with a full blown Theia app. I don't think this is what I need.

My existing BrowserWindow has contextIsolation enabled and there is a PR in Theia to Enable contextIsolation which is on the verge of being merged to master.

Assuming this will get merged any day now, I think what I need is to ignore @theia/electron and instead have my electron main process start up a Theia BackendApplication intended for the browser (from @theia/core/lib/node/backend-application-module).

My front end app can then communicate with that server as it would from the browser, since my BrowserWindow does not have access to Node runtime anyways (due to contextIsolation).

Assuming this is the correct path for me, I'm running into issues reconciling the location of compiled native modules. When adding the following minimal code from Theia into my Electron main.ts:

require('reflect-metadata');
const { Container } = require('inversify')
const { backendApplicationModule } = require('@theia/core/lib/node/backend-application-module');
const container = new Container();
container.load(backendApplicationModule);

I get the following error when running my app:

Uncaught Exception:
Error: Could not locate the bindings file. Tried:
→ /Users/admin/code/client/app/build/drivelist.node
→ /Users/admin/code/client/app/build/Debug/drivelist.node
→ /Users/admin/code/client/app/build/Release/drivelist.node
→ /Users/admin/code/client/app/out/Debug/drivelist.node
→ /Users/admin/code/client/app/Debug/drivelist.node
→ /Users/admin/code/client/app/out/Release/drivelist.node
→ /Users/admin/code/client/app/Release/drivelist.node
→ /Users/admin/code/client/app/build/default/drivelist.node

My Electron app compiles native modules using electron-builder install-app-deps

I understand that Theia also needs to compile some native modules for the browser or for electron.

theia rebuild:browser

gives me

native node modules are already rebuilt for browser

I don't see where they got compiled, but Ok..

theia rebuild:browser && theia rebuild:electron

gives me a new .brower_modules folder with the needed drivelist.node module:

enter image description here

However, clearly when the app loads it is not checking that location and is not finding driverlist.node

My Electron app gets compiled with webpack and has a relevant node-loader:

{
     test: /.node$/,
     loader: 'node-loader',
}

This works to load the native modules my Electron app needs. However, once I add the Theia code it can't find the driverlist.node which is clearly in my sight in .browser_modules.

I've tried various configurations for this node-loader, among other things, and can't figure it out.

parliament
  • 21,544
  • 38
  • 148
  • 238
  • Please add a link from where you got this code `require('reflect-metadata')...` Of course, I would like a minimally reproducible project (not to miss the details), but I don't know if you can provide it.I'm not sure if this will help, since there is no way to check, but have you tried `import { Container } from '@theia/core/shared/inversify';` maybe it's a different library, but I see it on github – Daniil Loban Apr 10 '23 at 12:30
  • Have you tried without `node-loader`? We personally use no node loader and our Electron app works fine. – Slbox Apr 11 '23 at 22:37

2 Answers2

2

I remember I had used electron-rebuild package to rebuild native modules for my Electron app.

npm install --save-dev electron-rebuild

Also before that, to make sure the native module path is correct, console.log statements can be used to check if the correct path is set and if the module being loaded is not undefined.

ALso native module's versions sometimes mismatch. like, Theia and electron version compatibility

Ganesh Nemade
  • 1,504
  • 12
  • 17
0

You can try adding the path to the .browser_modules folder to the NODE_PATH env ver in your Electron app main process

    process.env.NODE_PATH = `${__dirname}/.browser_modules`;
    require('module').Module._initPaths();
...code
Kareem Adel
  • 371
  • 2
  • 10
  • 1
    I wil try this in the next couple of days. I'm hopeful and if it works I'll reward additional bounty as mine expired before I can test. If you have anything to add before then, feel free. thanks – parliament Apr 19 '23 at 08:40