打开窗口
补充信息
以下示例中,窗口均采用:关闭 Node方式进行开发。
新增一个窗口配置
electron/main.ts
const baseOptions = {
options: {
webPreferences: {
preload: PRELOAD_JS,
enableRemoteModule: true,
},
},
}
export const windowsConfig: WindowConfig[] = [
{
name: 'main',
...baseOptions,
},
{
name: 'demo',
...baseOptions
},
补充信息
- 在 Modern.js 中,默认不用配置窗口的加载路径,默认加载对应入口在打包前后的路径,比如上述窗口:
demo
。- dev 时加载的路径为:
http://localhost:8080/demo
。 - prod 时加载的路径为:
file://xx/xx/html/demo/index.html
。
- dev 时加载的路径为:
- 关于如何新建一个入口,请参考:【开发中后台】。
打开窗口
一般,我们的窗口管理都是在主进程中。因此,打开窗口也是需要先在主进程中定义打开窗口服务。 我们新增方法:
electron/services/index.ts(主进程)
// 主进程
import { winService } from '@modern-js/runtime/electron-main';
export const openWindow = (winName: string) => {
return winService.createWindow({
name: winName
})
}
electron/preload/index.ts
// preloadJs 中
export const apis = {
...,
openWindow: (winName: string) => {
return callMain('openWindow', winName);
},
}
exposeInMainWorld(apis);
xx/xx.tsx
import bridge from '@modern-js/runtime/electron-bridge';
bridge.openWindow('demo');