博客
关于我
Electron框架下使用Nan模块开发C++插件
阅读量:733 次
发布时间:2019-03-21

本文共 2341 字,大约阅读时间需要 7 分钟。

Electron框架下使用Nan模块开发C++插件

最近接到PC桌面端视频开发的任务,之前一直使用C++外加AngularJS的模式开发,感觉架构略显笨重,尤其是在修改C++时,可是相当的繁琐,成本太高,客户受不了了 recent发现了一个新玩意Electron,集成Vue又可以插入C++插件,使业务功能解耦。

网上关于Electron入门文档众多,本人慢慢搞定了,本文正记录在追加C++插件过程中遇到的坑,供入门者参考。

项目名下新建三个文件:package.json

{"name": "项目名","version": "1.0.0","description": "Electron的C++插件","main": "main.js","dependencies": {"electron": "^3.0.8"},"devDependencies": {"electron-packager": "^12.2.0"},"scripts": {"test": "npm test","start": "electron ."},"author": "yaohj","license": "ISC"}

main.js

const electron = require('electron')const app = electron.appconst BrowserWindow = electron.BrowserWindowconst path = require('path')const url = require('url')

let mainWindow

function createWindow() {mainWindow = new BrowserWindow({width: 800,height: 600})mainWindow.loadURL(url.format({pathname: path.join(__dirname, 'index.html'),protocol: 'file:',slashes: true}))mainWindow.webContents.openDevTools()mainWindow.on('closed', function() {mainWindow = null})}

app.on('ready', createWindow)app.on('window-all-closed', function() {if (process.platform !== 'darwin') {app.quit()}})

app.on('activate', function() {if (mainWindow === null) {createWindow()}})

index.html

项目目录下执行命令:electron . 或 npm start

开始追加C++插件代码,在项目名/native下新建C++程序

注:引用网络代码段

#include <nan.h>void Add(const Nan::FunctionCallbackInfov8::value& info) {if (info.Length() < 2) {Nan::ThrowTypeError("Wrong number of arguments");return;}if (!info[0]->IsNumber() || !info[1]->IsNumber()) {Nan::ThrowTypeError("Wrong arguments");return;}double arg0 = info[0]->NumberValue();double arg1 = info[1]->NumberValue();v8::Localv8::number num = Nan::New(arg0 + arg1);info.GetReturnValue().Set(num);}

void Init(v8::Localv8::object exports) {exports->Set(Nan::New("add").ToLocalChecked(),Nan::Newv8::functiontemplate(Add)->GetFunction());}

NODE_MODULE(demo, Init)

修改index.html:

项目目录下新建binding.gyp:

{"targets": [{"target_name": "demo","sources": ["native/demo.cc"],"include_dirs": ["<! zákonpirat тут>"]}]

编译运行环境配置

安装Python2.7(官网下载安装)安装node-gyp:npm install -g node-gyp安装non:npm install -g non

开始编译运行

node-gyp configurenode-gyp build(网上资料编译没说明,编译出的demo.node不能在electron中运行,只能在node.js调用)

node-gyp rebuild --target=3.0.8 --arch=x64 --(dist-url=https://atom.io(download/electron) (有时build不好用,试试用rebuild)

运行

electron .

另外,build目录下有binding.sln,可用Visual Studio打开 작성C++代码

总结过程中坑太多,上述是经过几百次试验的最简步骤

转载地址:http://adrgz.baihongyu.com/

你可能感兴趣的文章
nginx + etcd 动态负载均衡实践(三)—— 基于nginx-upsync-module实现
查看>>
nginx + etcd 动态负载均衡实践(二)—— 组件安装
查看>>
nginx + etcd 动态负载均衡实践(四)—— 基于confd实现
查看>>
Nginx + Spring Boot 实现负载均衡
查看>>
Nginx + Tomcat + SpringBoot 部署项目
查看>>
Nginx + uWSGI + Flask + Vhost
查看>>
Nginx - Header详解
查看>>
nginx - thinkphp 如何实现url的rewrite
查看>>
Nginx - 反向代理、负载均衡、动静分离、底层原理(案例实战分析)
查看>>
Nginx - 反向代理与负载均衡
查看>>
nginx 1.24.0 安装nginx最新稳定版
查看>>
nginx 301 永久重定向
查看>>
nginx 301跳转
查看>>
nginx 403 forbidden
查看>>
nginx connect 模块安装以及配置
查看>>
nginx css,js合并插件,淘宝nginx合并js,css插件
查看>>
Nginx gateway集群和动态网关
查看>>
nginx http配置说明,逐渐完善。
查看>>
Nginx keepalived一主一从高可用,手把手带你一步一步配置!
查看>>
Nginx Location配置总结
查看>>