[英]electron-forge with two windows : how to render the second window? electron-react app
I realized that the second electron browser window, does actually opens, but it doesn't render correctly.我意识到第二个 electron 浏览器 window 确实打开了,但它没有正确呈现。
In /tools/forge/forge.config.js I have two entryPoints for the two windows:在 /tools/forge/forge.config.js 我有两个 windows 的两个入口点:
entryPoints: [
{
// React Hot Module Replacement (HMR)
rhmr: 'react-hot-loader/patch',
// HTML index file template
html: path.join(rootDir, 'src/index.html'),
// Renderer
js: path.join(rootDir, 'src/renderer.ts'),
// Main Window
name: 'main_window',
// Preload
preload: {
js: path.join(rootDir, 'src/preload.ts'),
},
},
{
// React Hot Module Replacement (HMR)
rhmr: 'react-hot-loader/patch',
// HTML index file template
html: path.join(rootDir, 'src/index_two.html'),
// Renderer
js: path.join(rootDir, 'src/renderer_two.ts'),
// Main Window
name: 'main_window2',
// Preload
preload: {
js: path.join(rootDir, 'src/preload.ts'),
},
},
],
And this is the related part in main.ts:这是 main.ts 中的相关部分:
declare const MAIN_WINDOW_WEBPACK_ENTRY: string;
declare const MAIN_WINDOW_PRELOAD_WEBPACK_ENTRY: string;
let mainWindow;
let mainWindow2;
const createWindow = (): void => {
mainWindow = new BrowserWindow({
})
mainWindow.loadURL(MAIN_WINDOW_WEBPACK_ENTRY);
mainWindow2 = new BrowserWindow({
})
// Is this correct??
mainWindow2.loadURL(MAIN_WINDOW_WEBPACK_ENTRY);
}
/src/renderer.ts: /src/renderer.ts:
import './app';
/src/renderer_two.ts: /src/renderer_two.ts:
import './app_two'
In src/app_two/components/App_two.tsx:在 src/app_two/components/App_two.tsx 中:
class App extends React.Component {
render(): JSX.Element {
return (
<div className='container'>
<h2 className='heading'>
SECOND WINDOW
</h2>
<p>
<button id="exchange-greetings-with-first-window" onClick={() => {
exchangeGreetingsFunct();
}}>Exchange Greetings with First Window</button>
</p>
</div>
);
}
}
As you can see, the second window, which is the one on the right, doesn't rendere correctly:如您所见,右侧的第二个 window 无法正确渲染:
How to correctly load the rendering for the second window?如何正确加载第二个 window 的渲染?
With this in main.ts:在 main.ts 中有这个:
ipcMain.handle("open-second-window", (IpcMainEvent, message) => {
//mainWindow2.loadURL(path.join('file://', process.cwd(), 'index-2.html'));
mainWindow2.loadURL('http://localhost:3000/main_window2'); // corresponding
to the main_window2 in /stc/tools/forge/forge.config.js :
mainWindow2.show();
});
Hello on entryPoints in package.json file you should do some thing like this你好 package.json 文件中的 entryPoints 你应该做这样的事情
"entryPoints": [
{
"html": "./src/foldera/view.html",
"js": "./src/renderer.js",
"name": "foldera_window",
"preload": {
"js": "./src/foldera/preload.js"
}
},
{
"html": "./src/folderb/view.html",
"js": "./src/renderer.js",
"name": "folderb_window",
"preload": {
"js": "./src/folderb/preload.js"
}
}
]
then you can use那么你可以使用
FOLDERA_WINDOW_PRELOAD_WEBPACK_ENTRY FOLDERA_WINDOW_WEBPACK_ENTRY
FOLDERB_WINDOW_PRELOAD_WEBPACK_ENTRY FOLDERB_WINDOW_WEBPACK_ENTRY
I think that the variable name depends on the name of the entryPoints我认为变量名称取决于 entryPoints 的名称
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.