仅支持 umi3
$ npm i umi-plugin-electron-builder --save-dev
or
$ yarn add umi-plugin-electron-builder --dev
安装之后执行 umi electron init 生成主进程文件 src/main/index.ts
$ umi electron init
or
$ yarn electron:init
默认安装最新版本的 electron
自动在 package.json 增加
{
scripts: {
'rebuild-deps': 'electron-builder install-app-deps',
'electron:init': 'umi electron init',
'electron:dev': 'umi dev electron',
'electron:build:win': 'umi build electron --win',
'electron:build:mac': 'umi build electron --mac',
'electron:build:linux': 'umi build electron --linux',
},
//这里需要修改成你自己的应用名称
name: 'electron_builder_app',
version: '0.0.1',
}
你可以手动将 package.json 中的 electron 修改至低版本,插件与 electron 版本无关
1、去掉 electron-webpack,electron-webpack-ts 依赖
2、主进程文件 src/main/main.ts 变更为 src/main/index.ts
3、删除 mainWebpackConfig,增加mainWebpackChain,使用 webpack-chain 的 API 修改 webpack 配置
4、src/main/tsconfig.json 变为可选
5、rendererTarget 的默认值设置 web(1.x 为 electron-renderer),在 Electron 中设置 nodeIntegration 为 true 时,rendererTarget 需要设置为 electron-renderer
$ umi dev electron
如报错请在对应系统上打包,路径不能有中文
//windows
$ umi build electron --win
//mac
$ umi build electron --mac
//linux
$ umi build electron --linux
//按平台打包
$ umi build electron --win --ia32 //32位
$ umi build electron --win --x64 //64位
$ umi build electron --win --armv7l //arm32位
$ umi build electron --win --arm64 //arm64位
例:使用 serialport 插件
$ npm i serialport @types/serialport -S
.umirc.ts
import { defineConfig } from 'umi';
export default defineConfig({
electronBuilder: {
//可选参数
buildType: 'webpack', //webpack或vite,vite构建速度更快,但兼容性有问题
mainSrc: 'src/main', //默认主进程目录
preloadSrc: 'src/preload', //默认preload目录,可选,不需要可删除
routerMode: 'hash', //路由 只能是hash或memory
outputDir: 'dist_electron', //默认打包目录
externals: ['serialport'], //node原生模块配置,打包之后找不到包也需要配置在这里
rendererTarget: 'web', //构建目标electron-renderer或web,使用上下文隔离时,必须设置为web
viteConfig(config: InlineConfig, type: ConfigType) {
//主进程Vite配置
//配置参考 https://vitejs.dev/config/
//ConfigType分为main和preload可分别配置
},
//通过 webpack-chain 的 API 修改 webpack 配置。
mainWebpackChain(config: Config, type: ConfigType) {
//ConfigType分为main和preload可分别配置
// if (type === 'main') {}
// if (type === 'preload') {}
},
builderOptions: {
//配置参考 https://www.electron.build/configuration/configuration
appId: 'com.test.test',
productName: '测试',
publish: [
{
provider: 'generic',
url: 'http://localhost/test',
},
],
}, //electronBuilder参数
},
routes: [{ path: '/', component: '@/pages/index' }],
});
在 Electron10 以上使用contextIsolation时 rendererTarget 需要设置成 web
builderOptions参考 Electron Builder
esbuild 暂不支持 typescript decorator metadata
Vite 与 typeorm 冲突,typeorm 在主进程无法使用
相关 Issue evanw/esbuild#257