Allow nx-electron:build webpack to resolve node_modules

[ratatoeskr666]

When building via nx-electron (webpack), dependencies from node_modules are not included.
Instead, electron-builder copies the whole node_modules folder to the ASAR/resources. Unfortunately it copies ALL dependencies! (also dev and deps from frontend projects).
Wouldn't it be better to resolve and bundle dependencies already in the electron-build process? So that the build artifact already contains all necessary sources

In the config file you exclude node_modules. Why is that so?

nx-electron/packages/nx-electron/src/utils/config.ts

Line 39 in 4cd3f2a

const webpackConfig: Configuration = {

I'd offer to create a PR to have an option to include node_modules, but before I'd like to ask for the reason why the dependencies aren't bundled.

[peebeebee]

@ratatoeskr666 : I see you resolved this one. Why did you close it? Did you found a solution for this?
Because I had the same thought as you.

[ratatoeskr666]

I closed the discussion because there are already options to bundle external deps.
Add under project.json/targets.build.options:

        "generatePackageJson": true,
        "externalDependencies": "none",
        "buildLibsFromSource": true,
        "extractLicenses": true,

Additionally I also set in maker.options.json:

"files": [
    "!**/node_modules${/*}",
    "!**/node_modules/*",
    "!/node_modules${/*}"
  ]

There still is the issue that no package.json is created, but the bundling worked for me. No more node_modules in the ASAR!

Anyhow, maybe we could add this to the documentation/readme? @bennymeg what's your opinion about this?

[peebeebee]

We also added the exclusion of node_modules in our files. But this seems like a hack somehow, I'd rather have a global option to say: "we want to bundle everything, so don't include node_modules."

To package everything, including the node_modules, we used a custom webpack-config, overriden the default one of this project.
Will experiment Monday with the target.build.options you provided, and will give feedback ASAP.

Thanks a lot for the comment!

[peebeebee]

I would've thought that...

        "externalDependencies": "none",
        "buildLibsFromSource": true

would fix our problem with not building node_modules dependencies in our main app, but it didn't.
We still had to use a custom-webpack config to get this working. Our custom webpack:

const TerserPlugin = require('terser-webpack-plugin');

module.exports = (config, context) => {
 const newConfig = {
   ...config,
   mode: 'production',
   optimization: {
     minimize: true,
     minimizer: [
       new TerserPlugin({
         terserOptions: {
           compress: true,
           mangle: true,
           keep_classnames: false,
           keep_fnames: false,
         },
       }),
     ],
   },
   externals: [],
   node: {
     __dirname: false,
     __filename: false,
   },
 };
 return newConfig;
};

And added the webpack config through: targets.build.options
"webpackConfig": "apps/touch-electron/webpack.config.js"

[ratatoeskr666]

sorry for the late response, had quite a busy week.
I thought for me, those params did the job. But I looked it up again an found out that I also set my target and module as follow:

"compilerOptions": {
    "target": "ES2022",
    "module": "CommonJS"
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
   ...
}

I don't know if these options are the reason that it works on my side.

And here is my main.js built (no more requires, everything bundled):