Illegal require("@angular/core") statement generated

[Rdmkr]

Apologies if this is not 100% nx-electron related, but my best guess is that the 16.0.0-beta1 package of this software is at fault.

Getting the following error when trying to serve electron app:

Error [ERR_REQUIRE_ESM]: require() of ES Module /home/blank/git/myrepo/gui-js/node_modules/@angular/core/fesm2022/core.mjs not supported.
Instead change the require of /home/blank/git/myrepo/gui-js/node_modules/@angular/core/fesm2022/core.mjs to a dynamic import() which is available in all CommonJS modules.
    at Function._load (node:electron/js2c/asar_bundle:2:13327)
    at @angular/core (/home/blank/git/myrepo/gui-js/dist/apps/minsky-electron/main.js:7522:18)
    at __webpack_require__ (/home/blank/git/myrepo/gui-js/dist/apps/minsky-electron/main.js:7700:41)
    at ./libs/shared/src/lib/material/material.module.ts (/home/blank/git/myrepo/gui-js/dist/apps/minsky-electron/main.js:7405:71)

Line number in main.js refers to:

/***/ ((module) => {

module.exports = require("@angular/core");

/***/ }),

Slightly more info and link to repo can be found here: https://stackoverflow.com/questions/77276313/require-of-es-module-not-supported-in-built-electron-app-code

[Rdmkr]

@bennymeg I sent you a donation, could I have your input on this? Any clarification appreciated.

[bennymeg]

The error state that you are trying to use require in an ES module.

I am not sure where in the main.ts I used @angular/core, did you added it? if so, did you require or imported it? Anyway, please try running this test project first.

BTW, thank you for the contribution, but I would have tried to help anyhow...

[Rdmkr]

"I am not sure where in the main.ts I used @angular/core, did you added it? if so, did you require or imported it?"

I did not add the require statement, that was generated by the build script.

I forked the test project here and tried to add a v16 angular app for testing: https://github.com/Rdmkr/nx-electron-boilerplate/tree/feature/angular-boilerplate

Currently running into a different problem when trying to serve:

TypeError: ws.readExecutor is not a function
    at readTargetOptions (/home/nrade/git/nx-ng-electron-boilerplate/node_modules/@nx/devkit/src/executors/read-target-options.js:19:27)
    at startBuild_1 (/home/nrade/git/nx-ng-electron-boilerplate/node_modules/nx-electron/src/executors/execute/executor.js:119:61)
    at startBuild_1.next (<anonymous>)
    at resume (/home/nrade/git/nx-ng-electron-boilerplate/node_modules/tslib/tslib.js:279:48)
    at /home/nrade/git/nx-ng-electron-boilerplate/node_modules/tslib/tslib.js:278:125
    at new Promise (<anonymous>)
    at i.<computed> [as next] (/home/nrade/git/nx-ng-electron-boilerplate/node_modules/tslib/tslib.js:278:67)
    at executor_1 (/home/nrade/git/nx-ng-electron-boilerplate/node_modules/nx-electron/src/executors/execute/executor.js:31:125)
    at executor_1.next (<anonymous>)
    at resume (/home/nrade/git/nx-ng-electron-boilerplate/node_modules/tslib/tslib.js:279:48)

It seems to have trouble instantiating the Workspace class:

function readTargetOptions({ project, target, configuration }, context) {
    var _a;
    const projectConfiguration = (context.workspace || context.projectsConfigurations).projects[project];
    const targetConfiguration = projectConfiguration.targets[target];
    const ws = new Workspaces(context.root);
    const [nodeModule, executorName] = targetConfiguration.executor.split(':');
    const { schema } = ws.readExecutor(nodeModule, executorName);
    const defaultProject = ws.calculateDefaultProjectName(context.cwd, { version: 2, projects: context.projectsConfigurations.projects }, context.nxJsonConfiguration);
    return (0, params_1.combineOptionsForExecutor)({}, (_a = configuration !== null && configuration !== void 0 ? configuration : targetConfiguration.defaultConfiguration) !== null && _a !== void 0 ? _a : '', targetConfiguration, schema, defaultProject, ws.relativeCwd(context.cwd));
}

[Rdmkr]

Solved that one... I didn't have an explicit version of @nx/devkit specified, so it probably defaulted to an old one.

[Rdmkr]

Angular v16 app is running in Electron in the test project...

[bennymeg]

Great!

[Rdmkr]

Something dawned on me today... The Electron app is not supposed to be depending on @angular/core... that's the web app's purview. The problem is likely just that the dependencies of my project aren't properly divided between the electron and the angular side... I spent some time moving the angular stuff into a "shared-ui" module that the electron app doesn't touch and the process is getting a lot farther than it did before... still not there yet but I think I'm across this hurdle.