Electron-react-boilerplate: Bug: Cannot resolve native dependencies in `app/package.json`

[anthonyraymond]

Hi,

Since last release (0.11.0), i can't import modules declared in app/package.json. I changed nothing, and it was working on this commit

It results in the following error

Uncaught Error: Cannot find module 'electron-config'
    at Module._resolveFilename (module.js:470)
    at Function.Module._resolveFilename (T:\ProjetsAutre\archive-notifier\node_modules\electron\dist\resources\electron.asar\common\reset-se…:35)
    at Function.Module._load (module.js:418)
    at Module.require (module.js:498)
    at require (internal/module.js:20)
    at Object.49 (external "electron-config":1)
    at __webpack_require__ (bootstrap 6b881ca…:657)
    at fn (bootstrap 6b881ca…:85)
    at Object../app/actions/settings.js (settings.js:2)
    at __webpack_require__ (bootstrap 6b881ca…:657)

In this case it's electron-config, but i tryed with differents modules. electron-config is installed with yarn.

app/package.json

{
  ...
  "scripts": {
    "postinstall": "npm rebuild --runtime=electron --target=1.6.1 --disturl=https://atom.io/download/atom-shell --build-from-source"
  },
  "license": "MIT",
  "dependencies": {
    "chokidar": "^1.6.1",
    "electron-config": "^0.2.1",
    "node-notifier": "^5.1.2",
    "node-yaml": "^3.0.3"
  }
}

How to reproduce

1. Clone the project.
2. app/package.josn

"dependencies": {
  "node-yaml": "^3.0.3"
}

1. app/index.js

import yaml from 'node-yaml';

1. yarn install
2. npm run dev

[amilajack]

Interesting. I'll look into this. Thanks for reporting!

[amilajack]

git clone https://github.com/chentsulin/electron-react-boilerplate.git foo
cd foo
yarn
cd app && yarn add --dev node-yaml && cd ..
# updated ./app/index.js to import 'node-yaml'
yarn build # no errors
yarn dev # Throws

Uncaught TypeError: Cannot read property 'filename' of undefined
    at Object.<anonymous> (index.js:24)
    at Object../app/node_modules/node-yaml/index.js (index.js:275)
    at __webpack_require__ (bootstrap 2c05b86…:657)
    at fn (bootstrap 2c05b86…:85)
    at Object../app/index.js (index.js:6)
    at __webpack_require__ (bootstrap 2c05b86…:657)
    at fn (bootstrap 2c05b86…:85)
    at Object.26 (bundle.js:40227)
    at __webpack_require__ (bootstrap 2c05b86…:657)
    at module.exports../app/actions/counter.js.Object.defineProperty.value (bootstrap 2c05b86…:706)

[anthonyraymond]

Hi don't know if this is related or not, but i added node-yaml as a dependcies not devDependencies, i never understood the difference anyway...
The error you highlighted also happen when adding node-yaml in /package.json instead of app/package.json.

My first tought was that it wasn't exported as externals in webpack config, but externals: Object.keys(externals || {}) do his job properly in webpack.config.base.js.

It may be because of it fail to resolve filename and don't expose the module... But i can't understand what has changed.

[amilajack]

See these issues:

https://github.com/sindresorhus/electron-config/issues/9
https://github.com/yargs/yargs/issues/390

Seems to be related to webpack

[Slapbox]

Seeing the same issue with electron-notifications package.

[Slapbox]

It seems worth mentioning that the only package I am seeing this error for (though perhaps there would be more to follow if this was not a show-stopper) is for the only package I am loading in my top level package.json and my app\package.json

[Slapbox]

Removing electron-notifications from my app\package.json only resolved the issue, though I know it will not build this way.

[amilajack]

What happens if you remove it from your ./package.json?

[Slapbox]

I haven't tried it in this build, but previous experience tells me it will not build without it being in the top level package.json

[Slapbox]

Builds, but yields an identical error.

[amilajack]

I found that https://github.com/chentsulin/electron-react-boilerplate/pull/921/commits/f36e9d26791d2c2389187cbdb9647f7335578516 is the cause of this. Will investigate further today

[amilajack]

I fixed this in the dev-master branch. Would be great if everyone here could test this. @Slapbox can you confirm that you don't experience the dynamic script injection race condition issue on that branch? Thanks!

[Slapbox]

Will do as soon as I can! Thanks for your hard work as always @amilajack

[anthonyraymond]

I try it in a few seconds.

[anthonyraymond]

Now having this error on npm run dev

[anthonyraymond]

Hum... i don't know what is vendor.dll.js actualy, but i supose it wasn't meant to be HTML right?
Don't know if it helps or not, i'm definely not a webpack expert ^^'

[amilajack]

@anthonyraymond my bad. I accidentally merged dev-master with master and that overrode the reverts that I made to dev-master. It should work this time

[Djiit]

Just tested it in dev-master, works great

[anthonyraymond]

Everything seems to work fine :)
Thanks !

[amilajack]

🎉 🎉 🎉

[rahmatkruniawan]

@amilajack after got error

> vendor.dll.js
what I have to do ? I still got same problem.
If work correctly please update the master, so we can use this boilerplate + sqlite ^^

[amilajack]

@rahmatkruniawan Native deps work on master now. made this repo as an example just for you. It demos using sqlite3 with electron-react-boilerlate. Enjoy!