search

bradstewart / electron-boilerplate-vue

Boilerplate application for Electron runtime
724 stars 94 forks source link

Serialport in app/package.json produces webpack errors #31

Closed davejm closed 8 years ago

davejm commented 8 years ago

Hi, I'm trying to use p5.serialserver - https://github.com/vanevery/p5.serialport (which requires serialport - a native module) in the app but am getting this error in the webpack build

WARNING in ./app/~/bindings/bindings.js
            Critical dependencies:
            78:22-40 the request of a dependency is an expression
            78:43-53 the request of a dependency is an expression
             @ ./app/~/bindings/bindings.js 78:22-40 78:43-53

I looked at the offending lines of code and the module's purpose seems to be to dynamically require binary modules by try a bunch of directories until it gets it.

Then when I try to use serialport in the app (main proces) I get this runtime error

Uncaught Exception:
Error: Could not locate the bindings file. Tried:
 → /home/myusername/Dev/p5.js-editor/build/serialport.node
 → /home/myusername/Dev/p5.js-editor/build/Debug/serialport.node
 → /home/myusername/Dev/p5.js-editor/build/Release/serialport.node
 → /home/myusername/Dev/p5.js-editor/out/Debug/serialport.node
 → /home/myusername/Dev/p5.js-editor/Debug/serialport.node
 → /home/myusername/Dev/p5.js-editor/out/Release/serialport.node
 → /home/myusername/Dev/p5.js-editor/Release/serialport.node
 → /home/myusername/Dev/p5.js-editor/build/default/serialport.node
 → /home/myusername/Dev/p5.js-editor/compiled/6.1.0/linux/x64/serialport.node
    at bindings (/home/myusername/Dev/p5.js-editor/dist/background.js:276:10)
    at Object.<anonymous> (/home/myusername/Dev/p5.js-editor/dist/background.js:5388:39)
    at __webpack_require__ (/home/myusername/Dev/p5.js-editor/dist/background.js:20:30)
    at Object.has (/home/myusername/Dev/p5.js-editor/dist/background.js:5626:26)
    at __webpack_require__ (/home/myusername/Dev/p5.js-editor/dist/background.js:20:30)
    at Object.start (/home/myusername/Dev/p5.js-editor/dist/background.js:5128:20)
    at EventEmitter.<anonymous> (/home/myusername/Dev/p5.js-editor/dist/background.js:152:13)
    at emitOne (events.js:96:13)
    at EventEmitter.emit (events.js:188:7)
    at EventEmitter.<anonymous> (/home/myusername/Dev/p5.js-editor/node_modules/electron-prebuilt/dist/resources/electron.asar/browser/api/web-contents.js:130:25)

I was able to solve this by moving serialport to my externals in webpack config and moving the dependency from app/package.json deps to the root package.json devDeps but I think this is wrong as it is a runtime dependency and the packaged app needs the relevant builds.

I've tried using node-loader as per https://github.com/webpack/webpack/issues/1040. Not sure if the solution involves some use of webpack's ContextReplacementPlugin.

Any thoughts? Thanks :)

Edit - I was able to get much more informative errors by changing the devtool setting in webpack.dev-background.conf.js and webpack.dev-main.conf.js from '#eval-source-map' to '#source-map'

davejm commented 8 years ago

@bradstewart

davejm commented 8 years ago

Hey I'm sure you're a busy guy. Just thought I'd drop a comment here in case anyone else was struggling with including native node modules in their apps. So I put the serialserver dependency in the app/package.json where it should be. I also went to the original electron boilerplate and copied its rebuild native dependencies script from the tasks dir, and appended a call to this to the postinstall command in the root package.json. Also had to manually remove ('bindings') from the require in serialport/lib/bindings.js. Now it works. Anyone wanting details just hit me up. I might create a PR to include the rebuild native modules script in this boilerplate as currently there's no built-in way to ship native deps. Thanks

pmilu commented 7 years ago

Hi! I still cannot resolve how to use serialport with webpack (electron-boilerplate-vue). I checked that if I use serialport in electron.js file it works. On the other hand every require for serialport in renderer process gives error:

"Could not locate the bindings file"

. Removing ('bindings') part doesn't help because it is required for serialport list function (sp.list(function(err, ports) {}))