Failed to Parse Native Modules

I have a very simple vue CLI 3 based sample project which I added vue-cli-plugin-electron builder to. Everything starts up correctly. Then I proceeded to add a simple nAPI native module which I compiled fine. I used the instructions here.

I added the following to a simple background.js

const testAddon = require('./testaddon.node');
module.exports = testAddon;

If I run

npm run electron:serve

I get

/ Bundling main process…

ERROR Failed to compile with 1 errors 10:14:03 AM

error in ./src/testaddon.node

Module parse failed: Unexpected character ‘�’ (1:2) You may need an appropriate loader to handle this file type. (Source code omitted for this binary file)

@ ./src/background.js 11:18-45 @ multi ./src/background.js

ERROR Build failed with errors. npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! elec3@0.1.0 electron:serve: vue-cli-service electron:serve npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the elec3@0.1.0 electron:serve script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:

I have tried a variety of things including adding a vue.config.js as mentioned in your documentation to add it as an external.

module.exports = { pluginOptions: { electronBuilder: { // List native deps here if they don’t work externals: [‘testaddon.node’], // If you are using Yarn Workspaces, you may have multiple node_modules folders // List them all here so that VCP Electron Builder can find them nodeModulesPath: [‘…/…/node_modules’, ‘./node_modules’] } } }

Can you please let me know what configuration I am missing? It looks like from what I could tell webpack trying to do something with the binary C++ dll and failing. But from what I have read in your documentation it appears that this native module support should work. Any points would be helpful.

• Windows 10 64 bit
• node version: 12.6.0
• npm version: 6.9.0
• vue-cli-plugin-electron-builder version : 1.3.6
• electron version: 5.0.0

[madhankk]

For people who have this same problem, what did work to make the .node file load was using this:

var myaddon = __non_webpack_require__('testaddon.node');

But I am not sure if this is standard and there is any other more ‘correct’ approach. Thanks for all the help.

[nklayman]

Try adding node-loader to the main process webpack config by setting your vue.config.js to:

module.exports = {
  pluginOptions: {
    electronBuilder: {
      chainWebpackMainProcess: config => {
        config.module.rule('node').test(/\.node$/).use('node-loader')
      },
    }
  }
}

The externals option is designed for native npm modules, not .node files, that is causing the error.