首页 > 代码库 > Windows Electron初探

Windows Electron初探

2024-10-14 09:39:39   214人阅读

最近闲来无事，玩玩electron。

1、安装nodejs

下载地址：http://nodejs.cn/download/，下载64位。安装完成后，打开C:\Program Files\nodejs\node_modules\npm目录，编辑npmrc文件，添加electron_mirror="https://npm.taobao.org/mirrors/electron/"。添加Electron的镜像。

2、新建文件夹DesktopApp，然后新建三个文件：

main.js  主逻辑文件

index.html 页面文件

package.json nodejs标准文件

在DesktopApp文件夹下，运行npm install electron。安装完成后，自动生成：package-lock.json和node_modules文件夹。

3、main.js文件

const electron = require(‘electron‘);
const app = electron.app;
const BrowserWindow = electron.BrowserWindow;

var mainWindow = null;

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

app.on(‘ready‘, function() {
  mainWindow = new BrowserWindow({width: 800, height: 600});
  mainWindow.loadURL(‘file://‘ + __dirname + ‘/index.html‘);
  mainWindow.on(‘closed‘, function() {
    mainWindow = null;
  });
});

4、package.json文件

{
  "name": "DesktopApp",
  "version": "0.1.0",
  "main": "main.js",
  "dependencies": {
    "electron": "^1.6.11"
  }
}

5、index.html文件

<!DOCTYPE html>
<html>
  <head>
    <title>Hello World!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
    We are using io.js <script>document.write(process.version)</script>
    and Electron <script>document.write(process.versions[‘electron‘])</script>.
  </body>
</html>

6、运行：

C:\>D:\DesktopApp\node_modules\electron\dist\electron.exe D:\DesktopApp

（用局部安装的electron的exe文件来执行项目）

 

Windows Electron初探


联系
我们