Electron-Nodejs-Addon入門

時間 2019-12-17

標籤 electron nodejs addon 入門简体版

原文原文鏈接

一、本次學習使用Electron的版本是1.8.0，Nodejs的版本是7.9.0，操做系統爲 Win10 x64，編譯器爲Microsoft VC++ 14html

二、安裝Node模塊:node-gyp node-pre-gyp nannode

三、編寫代碼以下：jquery

//hello.cclinux

#include <node.h>
///#include "boost/array.hpp"c++

namespace demo {git

using v8::FunctionCallbackInfo;
using v8::Isolate;
using v8::Local;
using v8::Object;
using v8::String;
using v8::Value;
using v8::Array;
using v8::Number;github

void Method(const FunctionCallbackInfo<Value>& args) {
Isolate* isolate = args.GetIsolate();
args.GetReturnValue().Set(String::NewFromUtf8(isolate, "world"));
//boost::array<int,9> arr = {1,2,3,4,5,6,7,8,9};

//Local<Array> v8array = Array::New(isolate);
//for(int i = 0;i < 9;i++){
// v8array->Set(i,Number::New(isolate,arr[i]));
// }
// args.GetReturnValue().Set(v8array);
}web

void init(Local<Object> exports) {
NODE_SET_METHOD(exports, "hello", Method);
}shell

NODE_MODULE(NODE_GYP_MODULE_NAME, init)npm

} // namespace demo

四、編寫編譯配置文件

//binding.gyp

{
"targets": [
{
"target_name": "hello",
"sources": [ "hello.cc" ],
   "include_dirs":[

   ],
   "libraries":[],
   "link_settings":{
       "libraries":[]
   },
   #"cflags!": [ "-fno-exceptions" ],
#"cflags": [ "-std=c++11" ],
#"cflags_cc!": [ "-fno-exceptions" ]
}
]
}

五、生成編譯配置

在CMD裏運行：

node-gyp configure --target=1.8.0 --arch=x64 --dist-url=https://atom.io/download/atom-shell

等待依賴文件下載完成，配置完成

六、編譯代碼

node-gyp build --target=1.8.0 --arch=x64

七、編寫Electron啓動代碼

//main.js

const path = require('path')
const electron = require('electron')

const BrowserWindow = electron.BrowserWindow
const app = electron.app

const debug = true

if (process.mas) app.setName('Electron APIs')

var mainWindow = null

function initialize () {
var shouldQuit = makeSingleInstance()
if (shouldQuit) return app.quit()

// loadDemos()

function createWindow () {
var windowOptions = {
width: 1080,
minWidth: 680,
height: 840,
title: app.getName()
}

if (process.platform === 'linux') {
windowOptions.icon = path.join(__dirname, '/assets/app-icon/png/512.png')
}

mainWindow = new BrowserWindow(windowOptions)
mainWindow.loadURL(path.join('file://', __dirname, '/index.html'))

// Launch fullscreen with DevTools open, usage: npm run debug
if (debug) {
mainWindow.webContents.openDevTools()
mainWindow.maximize()
//require('devtron').install()
}

mainWindow.on('closed', function () {
mainWindow = null
})
}

app.on('ready', function () {
createWindow()
// autoUpdater.initialize()
})

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

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

// Make this app a single instance app.
//
// The main window will be restored and focused instead of a second window
// opened when a person attempts to launch a second instance.
//
// Returns true if the current version of the app should quit instead of
// launching.
function makeSingleInstance () {
if (process.mas) return false

return app.makeSingleInstance(function () {
if (mainWindow) {
if (mainWindow.isMinimized()) mainWindow.restore()
mainWindow.focus()
}
})
}

// Require each JS file in the main-process dir
//function loadDemos () {
// var files = glob.sync(path.join(__dirname, 'main-process/**/*.js'))
// files.forEach(function (file) {
// require(file)
// })
//autoUpdater.updateMenu()
//}

// Handle Squirrel on Windows startup events
switch (process.argv[1]) {
case '--squirrel-install':
//autoUpdater.createShortcut(function () { app.quit() })
break
case '--squirrel-uninstall':
//autoUpdater.removeShortcut(function () { app.quit() })
break
case '--squirrel-obsolete':
case '--squirrel-updated':
app.quit()
break
default:
initialize()
}

八、編寫Electron頁面代碼

//index.html

<!doctype html>
<html>

<head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">

   <script src="./jquery-3.2.1.min.js"></script>
   <script>if (typeof module === 'object') {window.jQuery = window.$ = module.exports;};</script>

   <script>
       var addon = require('./build/Release/hello')
       $(document).ready(function(){
           $('#test-addon-btn').click(function(){
               console.log(addon.hello());
           });
       });
   </script>
</head>

<body>

</html>

九、編寫Electron運行的package.json文件

{
"name": "ElectronAddonHello",
"productName": "Electron Addon Demos",
"version": "1.3.0",
"description": "Electron Addon demos",
"private": true,
"main": "main.js",
"repository": "https://github.com/juxiangwu/electron-node-addons",
"keywords": [
"Electron",
"API",
"demo"
],
"author": "Jenson",
"license": "MIT",
"devDependencies": {
"chai": "^3.4.1",
"chai-as-promised": "^6.0.0",
"check-for-leaks": "^1.2.0",
"devtron": "^1.3.0",
"electron": "~1.6.2",
"electron-packager": "^8.6.0",
"electron-winstaller": "^2.2.0",
"husky": "^0.14.3",
"mocha": "^3.1.0",
"npm-run-all": "^4.0.2",
"request": "^2.70.0",
"rimraf": "^2.5.2",
"signcode": "^0.5.0",
"spectron": "~3.6.0",
"standard": "^8.2.0"
},
"dependencies": {
"electron-settings": "^3.0.7",
"electron-shortcut-normalizer": "^1.0.0",
"glob": "^7.1.0",
"highlight.js": "^9.3.0"
},
"standard": {
"env": {
"mocha": true
}
}
}

十、運行測試結果

1. babel從入門到入門 babel從入門到入門
2. babel從入門到入門
3. cookie入門 cookie入門
4. JVM從入門到入門！
5. WebAssembly——從入門到入門
6. python-入門 Python入門
7. makefile從入門到入門
8. MySQL從入門到入門
9. unity入門_Unity入門
10. 入門知識——Linux入門
更多相關文章...
• Memcached入門教程 - NoSQL教程
• Neo4j數據庫入門教程 - NoSQL教程
• YAML 入門教程
• Java Agent入門實戰（一）-Instrumentation介紹與使用

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。