electron-egg front-end module

Code directory: ./frontend

  • Can use any front-end technology
  • The front-end module in the project is just a demo, you can modify or delete it at will
  • vue2, vue3, react, Angular, html, etc.
  1. Simple configuration:
打开配置文件:./electron/config.default.js,可修改如下配置:
  developmentMode: {
    default: 'vue', // 默认前后端分离,使用vue
    mode: {
    	// 前后端分离,使用vue开发,端口与vue启动的serve一致
      vue: {
        hostname: 'localhost',
        port: 8080
      },
      // 前后端分离,使用react开发,端口与react启动的serve一致
      react: {
        hostname: 'localhost',
        port: 3000
      },
      html: {
        hostname: 'localhost',
        indexPage: 'index.html' // 首页
      },
    }
  },

2. Just one file: ipcRenderer.js

# 你的前端项目需要引入该文件,才能和electron业务层通信
# vue3或react用户,请修改其语法(当前为vue2)

3. start

  • vue mode [default]
# 1:【进入前端目录】,启动vue
cd ./frontend
npm run serve

# 2:【根目录】,启动electron服务
npm run dev
  • react mode, same as vue
  • HTML mode (not recommended, use vue and react, keep up with the times)
# 1:进入前端目录,并创建dist目录
cd ./frontend && mkdir dist

# 2: 编写html文件
index.html

# 3:【根目录】,启动electron服务
npm run dev

Guess you like

Origin blog.csdn.net/qq_32660241/article/details/124347302