Electron-Vue程序启动控制台报错：Uncaught ReferenceError: require is not defined at (index):1

一、前言

我在使用electron制作exe安装包的项目中用到了nodejs的一个usb模块，遇到了一些问题。

二、问题描述

npm install安装（我的这个版本是：“usb”: “^1.6.3”,）之后，启动项目之后发现页面空白，我打开控制台发现了这样的报错：

三、问题分析和解决

1、分析

这里需要知道electron本质是什么，来看一张图片：

Chromium : 为Electron提供了强大的UI能力，可以不考虑兼容性的情况下，利用强大的Web生态来开发界面。
Node.js ：让Electron有了底层的操作能力，比如文件的读写，甚至是集成C++等等操作，并可以使用大量开源的npm包来完成开发需求。
Native API ： Native API让Electron有了跨平台和桌面端的原生能力，比如说它有统一的原生界面，窗口、托盘这些。
Chromium就是一个（种）浏览器，所以，这时候就需要看下你是不是在浏览器中运行node.js的模块了.不要把node.js和js搞混了,两个的运行环境是不相同.所以,你再浏览器环境下使用node.js的方法显示的not defined.

2、解决

你需要在index.js或者你可能叫main.js中允许使用（集成）nodejs，就是在webPreferences中加上nodeIntegration: true。

  mainWindow = new BrowserWindow({
    height: 563,
    useContentSize: true,
    width: 1000,
     webPreferences: {
       nodeIntegration: true    // 是否集成 Nodejs
    }
  })

四、问题解决

如果做了上面的操作发现项目启动有问题还是有报错，可能这个usb是一个nodejs的原生模块，要想在electron中使用nodejs的原生模块，你还需要执行一些操作：
为electron安装并重新编译模块

npm install --save-dev electron-rebuild
# Every time you run "npm install", run this:(每次执行了npm install之后，都要在vscode的终端框（TERMINAL）里面执行下面的命令)
./node_modules/.bin/electron-rebuild

# If you have trouble on Windows, try:(如果你在Windows系统下执行上一行命令出了问题，试一下在vscode的终端框（TERMINAL）里面执行下面这行代码)
.\node_modules\.bin\electron-rebuild.cmd

附上官方文档这块的链接把，中文的，很详细：
使用原生node模块
最后，没有什么意外的话，就可以正常启动项目了。话不多说，直接上效果图：

参考链接：
electron官网（中文）
技术胖
浏览器报Uncaught ReferenceError: require is not defined
Uncaught ReferenceError: require is not defined