创建election项目的几种方式

一：手动创建

// 新建项目文件夹
mkdir my-app

// 进入项目文件夹
cd my-app

// 创建package.json文件
npm init -y || npm init --yes

// 新建main.js文件
echo>main.js

// 新建index.html文件
echo>index.html

// index.html



    
    


    hello electron

// main.js
const path = require('path')
const {app, BrowserWindow} = require('electron')

let mainWindow = null

function createWindow(){
    mainWindow = new BrowserWindow({
        width: 1080,
        minWidth: 680,
        height: 840,
        webPreferences:{      // 渲染进程使用node模块【require】
            nodeIntegration:true
        }
    })
    // mainWindow.loadFile('./index.html')
    mainWindow.loadURL(path.join('file://', __dirname, '/index.html'))

    mainWindow.webContents.openDevTools()

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

app.on('ready', () => {
    createWindow()
})

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

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

// package.json
{
  "name": "my-app",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",              // 这里
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "electron ."        // 这里
  },  
  "keywords": [],
  "author": "",
  "license": "ISC"
}

二：克隆官方的快速启动项目

# Clone this repository
git clone https://github.com/electron/electron-quick-start
# Go into the repository
cd electron-quick-start
# Install dependencies
npm install
# Run the app
npm start

三：使用electron-forge快速生成

// 安装electron-forge(全局安装)
npm i electron-forge -g

// 查看是否安装成功
electron-forge --version

// 创建项目
electron-forge init my-app

// 进入项目文件夹
cd my-app2

// 启动运行：不需要npm i，因为创建项目已经install了
npm start

四：使用npx快速创建

// node版本>5.2会和node一起安装，可以直接使用

// 检测是否有npx
npx -v

// 如果没有可以手动安装
npm i npx -g

// 创建electron项目
npx create-electron-app my-app

// 进入项目文件夹
cd my-app

// 运行项目：具体的指令看package.json中的script配置项 || electron .
npm start