Search code examples
electronnode-sqlite3

Can't use sqlite in electron renderer process: "Cannot read property '_handle' of undefined"

I'm trying to use node-sqlite3 in an electron app, but in the app window, I'm getting the following error in the chrome console:

Uncaught TypeError: Cannot read property '_handle' of undefined
    at file:///[...]/assets/js/bundle.js:38727:15
    at Array.forEach (native)
    at module.exports (file:///[...]/assets/js/bundle.js:38726:36)
    at Object.<anonymous> (file:///[...]/assets/js/bundle.js:34699:1)
    at Object.147._process (file:///[...]/assets/js/bundle.js:34999:4)
    at s (file:///[...]/assets/js/bundle.js:1:254)
    at file:///[...]/assets/js/bundle.js:1:305
    at Object.<anonymous> (file:///[...]/assets/js/bundle.js:32065:11)
    at Object.141.../package.json (file:///[...]/assets/js/bundle.js:32246:4)
    at s (file:///[...]/assets/js/bundle.js:1:254)

The error happens at line 3 of file:///[...]/assets/js/node_modules/sqlite3/node_modules/set-blocking/index.js (this file is automatically generated and deleted, I didn't write it):

module.exports = function (blocking) {
  [process.stdout, process.stderr].forEach(function (stream) {
    if (stream._handle && stream.isTTY && typeof stream._handle.setBlocking === 'function') {
      stream._handle.setBlocking(blocking)
    }
  })
}

This happen only when using const sqlite3 = require('sqlite3') inside the renderer process (in a React component for example). require('sqlite3') works without any problem (database call works) when used in the main electron process.

This example app shows that it is possible to use the sqlite module in the renderer process. I don't understand why it doesn't work in my case.

My package.json:

{
  ...,
  "scripts": {
    "postinstall": "install-app-deps",
    "start": "electron .",
    "watch": "watchify app/app.js -t babelify -o assets/js/bundle.js --debug --verbose",
    "watch-style": "sass -r sass-globbing --watch style/application.scss:assets/css/bundle.css"
  },
  "devDependencies": {
    "babel-preset-stage-2": "^6.24.1",
    "electron-builder": "^19.49.4"
  },
  "dependencies": {
    "babel": "^6.23.0",
    "babel-core": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babelify": "^8.0.0",
    "browserify": "^14.5.0",
    "electron": "^1.7.10",
    "electron-reload": "^1.2.2",
    "electron-window-state": "^4.1.1",
    "react": "^16.2.0",
    "sqlite3": "^3.1.13",
    "watchify": "^3.9.0",
    ...
  }
}

I use: node 7.9.0, chrome 58.0.3029.110, electron 1.7.10.

I created an issue on github here.

Solution

  • The reason it doesn't work in your renderer process is it's bundled via browserify, which aims to generate bundle for browser. Specific code you're failing rely on node.js side globals (process), so browserify cannot able to bundle it correctly. Moreover, sqlite3 module have native module inside which cannot be bundled. Other bundlers like webpack have way (externals option) to specify not to try bundle it, you may need to configure in similar way using browserify if it supports it.

    It also explains why example app works, it doesn't do any bundling for renderer process.