electron教程入門1

electron創建的三種方式

一  通過git 克隆快速展示項目

# 安裝electron(只需安裝一次)
$ npm install electron -g
# 克隆這倉庫
$ git clone https://github.com/electron/electron-quick-start
# 進入倉庫
$ cd electron-quick-start
# 安裝依賴庫
$ npm install
# 運行應用
$ npm start

 

二   通過electron-forge安裝

# 安裝electron(只需安裝一次)
$ npm install electron-forge-g
# 創建項目
$ electron-forge init my-new-app
# 進入項目
$ cd my-new-app
# 安裝依賴庫
$ npm install
# 運行應用
$ npm start

三   手動安裝
   1 新建一個文件夾,自己命名,就是項目名

   2 進入文件夾,創建index.html   main.js

   3 執行npm init  生成package.json

//main.js
const electron=require("electron")
let app=electron.app
let BrowserWindow=electron.BrowserWindow
let mainWindow=null;
app.on("ready",function(){
    mainWindow = new BrowserWindow({
        width:400,
        height:400,
        webPreferences: {
            nodeIntegration:true,
            preload: path.join(__dirname, 'preload.js')
        }
    })
    mainWindow.loadFile("index.html")
    //mainWindow.loadURL("http://localhost:8089")
    mainWindow.on("closed",()=>{
        mainWindow=null
    }) 
})