zoukankan      html  css  js  c++  java
  • Electron快速入门

    node -v

    npm -v

    安装node环境

    my-electron-app/

    ├── package.json

    ├── main.js

    └── index.html

    为您的项目创建一个文件夹并安装 Electron:

    mkdir my-electron-app && cd my-electron-app

    npm init -y

    npm i --save-dev electron

    main.js代码:

    const { app, BrowserWindow } = require('electron')
    
    function createWindow () {
      const win = new BrowserWindow({
         800,
        height: 600,
        webPreferences: {
          nodeIntegration: true
        }
      })
    
      win.loadFile('index.html')
    }
    
    app.whenReady().then(createWindow)
    
    app.on('window-all-closed', () => {
      if (process.platform !== 'darwin') {
        app.quit()
      }
    })
    
    app.on('activate', () => {
      if (BrowserWindow.getAllWindows().length === 0) {
        createWindow()
      }
    })
    

      index.html

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <title>Hello World!</title>
        <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
    </head>
    <body style="background: white;">
        <h1>Hello World!</h1>
        <p>
            We are using node <script>document.write(process.versions.node)</script>,
            Chrome <script>document.write(process.versions.chrome)</script>,
            and Electron <script>document.write(process.versions.electron)</script>.
        </p>
    </body>
    </html>
    

      package.json

    {
      "name": "my-electron-app",
      "version": "1.0.0",
      "description": "",
      "main": "main.js",
      "scripts": {
        "start": "electron ."
      },
      "keywords": [],
      "author": "",
      "license": "ISC",
      "devDependencies": {
        "electron": "^11.2.2"
      }
    }
    

      启动:npm start 命令行

  • 相关阅读:
    Ext.create() 时的自适应高度和宽度
    C++ builder快捷键大全
    删除右键菜单中的选项
    函数中指针和引用的形参和实参
    一道关于继承和多态的题目
    关于静态对象构造
    关于多态代码和运行结果
    如何使用C++ Builder 6.0连接Access数据库
    BCB中的RTTI机制
    scanf()返回值(转)
  • 原文地址:https://www.cnblogs.com/q1359720840/p/14375573.html
Copyright © 2011-2022 走看看