主窗口加载index.html新窗口加载second.html
如下
一、创建second.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vite App Second</title>
</head>
<body>
<div id="appsec"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
二、在vite.config.js加入以下内容
export default defineConfig({
。。。。
build:{
rollupOptions:{
input:{
main:resolve(__dirname,"index.html"),
second:resolve(__dirname,"second.html"),
}
}
},
。。。。。
})
三、electron的主入口.js文件默认窗口代码如下
async function createSecondWindow(){
const mainWindow = new BrowserWindow({
width:800,
height:600,
icon: path.join(__dirname,"../public/favicon.ico"),
webPreferences:{
preload:path.join(__dirname,'preload.js'),
nodeIntegration: false,
contextIsolation: true,
enableRemoteModule: false,
}
})
Menu.setApplicationMenu(null)
if(app.isPackaged){
mainWindow.loadFile('./dist/second.html')
}else{
mainWindow.loadFile(path.join(__dirname,'../dist/second.html'))
}
}
async function createWindow(){
const mainWindow = new BrowserWindow({
width:800,
height:600,
icon: path.join(__dirname,"../public/favicon.ico"),
webPreferences:{
preload:path.join(__dirname,'preload.js'),
nodeIntegration: false,
contextIsolation: true,
enableRemoteModule: false,
}
})
Menu.setApplicationMenu(null)
if(app.isPackaged){
mainWindow.loadFile('./dist/index.html')
}else{
mainWindow.loadURL('http://localhost:5173')
}
createSecondWindow()
}
四、创建SecApp.vue
<script setup>
</script>
<template>
<div>
This is SecApp XXXXX WWW
</div>
</template>
<style scoped>
</style>
四、在src/main.js添加以下内容
import SecApp from './SecApp.vue'
const secapp = createApp(SecApp)
secapp.use(ElementPlus)
secapp.mount('#appsec')
