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

二、问题描述

npm install安装(我的这个版本是:“usb”: “^1.6.3”,)之后,启动项目之后发现页面空白,我打开控制台发现了这样的报错:
在这里插入图片描述

三、问题分析和解决

这里需要知道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.

你需要在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

一、前言我在使用electron制作exe安装包的项目中用到了nodejs的一个usb模块,遇到了一些问题。二、问题描述npm install安装(我的这个版本是:“usb”: “^1.6.3”,)之后,启动项目之后发现页面空白,我打开控制台发现了这样的报错:三、问题分析和解决1、分析这里需要知道electron本质是什么,来看一张图片:Chromium : 为Electron提供了强大的UI能力,可以不考虑兼容性的情况下,利用强大的Web生态来开发界面。Node.js :让Electr electron+vuecli3 实现设置打印机,静默打印小票功能 git clone https://github.com/sunniejs/electron-vue-print-demo.git npm install npm run electron:serve 1.用户点击打印 2.查询本地 electron-store(用来向本地存储,读取数据)是否存打印机名称 3.已经设置,直接打印 4.没有设置,弹出设置打印机框 5.用户设置好确认后打印 有什么问题可以提 issue 或扫描微信二维码跟我联系,项目持续优化,加群获取最新更新消息 您可以扫描添加下方的微信并备注 Sol 加交流群,给我提意见,交流学习。 如果对你有帮助送我一颗小星星(づ ̄3 ̄)づ╭:red_heart:~
解决办法 : 小白刚学的Electron,启动时报了个错,没整明白,看了文档,虽然找到解决办法,但是具体原因不是太明白,这里记录一下解决的方法。还希望有大佬看到解疑答惑一下。 1、安装的v12.0.2版的electron,这个版本更改了 contextIsolation 的默认值,从 false 更改为 true。更改这个默认设置可提高 Electron 应用的默认安全性 2、个人理解就是为true的话,主进程就是一个独立的运行环境,对应的渲染进程是获取不到的,所以这里设置为false可以解决问题。
当我们使用electron的时候,想要使用nodejs以及第三方的时候出现Uncaught ReferenceError: require is not defined,这种问题的时候,也许并不是我们的问题而是少了配置。也可能是版本的问题。 而我们只需要再加一个配置,这个错误提示就会消失, webPreferences: { nodeIntegration: true, contextIsolation:false // 把这一项加上错误就会消失 nodeInteg
当我们使用electron的时候,想要使用nodejs以及第三方的时候出现Uncaught ReferenceError: require is not defined,这种问题的时候,也许并不是我们的问题而是少了配置。也可能是版本的问题。 而我们只需要再加一个配置,这个错误提示就会消失, webPreferences: { nodeIntegration: true, contextIsolation:false // 把这一项加上错误就会消失 nodeInteg
解决git clone时fatal: unable to access ‘https://gitee.com/XXX.git/‘: The requested returned error: 403 46553