electron-builder install-app-deps tries to include react-native while I have an alias set in webpack to react-native-electron

Question

How do I tell electron-builder to package react-native-electron instead of react-native? I could not find anything about alias in the electron-builder docs and it's also surprising because it's not a native module so it doesn't contain any .node files, and webpack (through electon-webpack) has taken care of all the packaging.

This is on Ubuntu.

The development build using the webpack server managed by electron-webpack (with the command electron-webpack dev) works perfectly.

If I try yarn add react-native it does build but when I start the resulting app it opens but does nothing.

I also tried to copy the react-native-electron folder and renaming it to react-native. Then it does build but if I start it, it does not even open but I do see it doing nothing in system monitor.

When I try electron-builder install-app-deps without react-native it errors out with:

Error: Unresolved node modules: react-native
    at /media/dj/dev/scan-app-desktop/node_modules/electron-builder-lib/src/util/packageDependencies.ts:108:17
From previous event:
    at Collector.resolveUnresolvedHoisted (/media/dj/dev/scan-app-desktop/node_modules/electron-builder-lib/src/util/packageDependencies.ts:164:10)
    at /media/dj/dev/scan-app-desktop/node_modules/electron-builder-lib/src/util/packageDependencies.ts:82:18
    at Generator.next (<anonymous>)
    at runCallback (timers.js:763:18)
    at tryOnImmediate (timers.js:734:5)
    at processImmediate (timers.js:716:5)
From previous event:
    at Collector.collect (/media/dj/dev/scan-app-desktop/node_modules/electron-builder-lib/src/util/packageDependencies.ts:84:6)
    at /media/dj/dev/scan-app-desktop/node_modules/electron-builder-lib/out/util/packageDependencies.js:123:47
    at Generator.next (<anonymous>)
(...)

in my package.json I have the electronWebpack config:

      "electronWebpack": {
        "renderer": {
          "webpackConfig": "webpack.renderer.additions.js"
        }
      },

and in webpack.renderer.additions.js:

const path = require('path')

const resolve = {
  alias: {
    'react-native': path.join(__dirname, 'node_modules/react-native-electron')
  }
}

module.exports = {resolve}

https://github.com/PaulLeCam/react-native-electron/issues/4

ThaJay ThaJay · Accepted Answer · 2018-06-05T13:56:33

Seems like the definition of devDependencies is a bit different than I'm used to. In this case, packages that would normally just be dependencies are now only used by webpack and not by electron-builder. electron-builder includes the dependencies but not the devDependencies. So all js modules with no native component can be in devDependencies because they don't have to be included in the final electron build because webpack has already bundled them. electron-builder does not look at the webpack config so it does not know about the alias, but as it turns out packages like ract-navigation and their subdependencies (like react-native) should not be in the build twice anyway.

So move everything that should not be included separately to devDependencies and the app will compile. It did not start because of errors but that's another problem probably

electron-builder install-app-deps tries to include react-native while I have an alias set in webpack to react-native-electron

1 Answers