Electron 使用 Node 原生模块“踩坑”

electron

前言

最近工作上接触到一个 electron 项目,在 Windows 环境和 Node 原生模块(Node C++ 插件)的双重困难 Buff 加成下,此文诞生,打响了自己 electron 小白的第一枪。

此处不再记录各种错误,而是直接写下正确的步骤。记录那些错误是没有意义的,因为都是可以避免的(见总结)。

准备工作

为了避免各种各样的问题,我们从头开始记录。

先搞定网络问题,老生常谈的镜像配置:

npm config set registry https://registry.npm.taobao.org

不过我更推荐使用 nrm 镜像管理工具,可以简单地在多个镜像源之间切换:

npm i -g nrm

nrm use taobao

由于 electron 安装会去下载二进制文件,所以还要单独配置它的国内镜像(默认从 GitHub 下载,巨慢):

npm config set ELECTRON_MIRROR https://cdn.npm.taobao.org/dist/electron/

这里说一个无语的坑:千万不要把镜像配成这个 https://npm.taobao.org/mirrors/electron/ !否则会由于官方版本号带 v (如 v8.0.0) 而该镜像下版本号没有 v 导致一直下载 404。

然后安装 Node.js 原生插件的构建工具 node-gyp :

npm i -g node-gyp

Windows 独家特色来了!

如果 Win 用户想要编译原生 Node 模块,还需要安装 Python 2.7Visual Studio(最好是 2015 版本及以上)。感觉头大有没有,但好在前人栽树后人乘凉(windows-build-tools):

# 一行命令自动安装,VIP 般的服务
# 记得用管理员权限打开 CMD 执行
npm i -g windows-build-tools

进入正题

搞了半天(Vistual Studio 的安装很慢)才可以开始下载 node_modules

npm i

是不是以为完事了?现在才是点题的时候,Node 原生模块在 Electron 下是不能直接使用的!看下官方解释:

Electron 支持原生的 Node 模块,但由于 Electron 非常有可能使用一个与您的系统上所安装的 Node 不同的 V8 引擎,您所使用的模块将需要被重新编译。

官方既然想到了这个问题,肯定提供了解决方案:

npm i -D electron-rebuild

# 每次"npm install"后,需要再来一下这个命令
./node_modules/.bin/electron-rebuild.cmd

注意:使用的原生模块一定是要在 package.jsondependencies 下,否则 electron-rebuild 是找不到需要重编译的模块的。至此,我终于把项目跑起来了!啦啦啦~

总结

最常见的就是 Win 下 ffisqlite3 直接在 Electron 下用各种错,网上记录错误的博文一抓一把,都说踩坑了,但从自己那么多次所谓的踩坑经历来看,有些坑真的是自找的!

我一开始遇到问题往往是怎么解决呢?控制台报错,复制错误信息往百度或谷歌里一丢,出来一堆博文,找一篇按照其步骤走一遍,但由于问题并非完全一样,环境也不一样,往往从问题 A 变成了问题 B,然后陷入搜索的死循环……

回到今天这个“坑”,如果能先从一手资料(官方文档)入手,完全可以避免所有问题。关于 Electron 如何使用 Node 原生模块,文档介绍得清清楚楚;如果你是使用的 electron-vue ,那从它的文档中我们能知道 Windows 下需要先安装 windows-build-tools

这里也是给自己和大家提个醒,不要再陷入搜索死循环中了。

参考资料

手滑了就鼓励一下吧~