Sockets 将网页包和套接字服务器连接到electron预加载脚本

我正在开发一个独立的桌面应用程序，似乎遇到了一个障碍。我可以在electron中成功编译和运行我的electron/vue应用程序，但是我仍然需要在另一个终端中手动运行Web包服务器和套接字服务器。我想知道一次或在后台运行所有服务的最佳方法

以下是我当前的electron main.js：

const{app，BrowserWindow}=require（'electron'）；
const path=require（'路径'）
让win=null；
//初始化
app.on（'ready'，function（）{
win=新浏览器窗口({
宽度：1000，
身高：600，
网络首选项：{
//这目前不起作用
预加载：path.resolve（uu dirname，“./config/socketServer.js”）
}
});
win.loadURL（'http://localhost:3000');
win.openDevTools（）；
win.on（'关闭'，函数（）{
win=null；
});
});
//后续初始化
app.on（'activate'，（）=>{
如果（win==null）{
win=新浏览器窗口（{宽度：1000，高度：600}）；
win.loadURL（'http://localhost:3000');
win.on（'关闭'，函数（）{
win=null；
});
}
});
应用程序打开（'window-all-closed'，函数（）{
if（process.platform！=='darwin'）{
app.quit（）；
}
});

package.json脚本：

“脚本”：{
“dev”：“webpack dev server--inline--progress--config build/webpack.dev.conf.js”，
“服务器”：“nodemon./config/server.js--watch”，
“socket”：“nodemon./config/socketServer.js--watch”，
“开始”：“电子”，
“lint”：“eslint--ext.js、.vue src”，
“build”：“node build/build.js”，
“pack”：“electron builder--dir”，
“dist”：“electron builder”，
“postinstall”：“electron builder安装应用程序deps”
},

和webpack.dev.conf：

“严格使用”
const-utils=require（“./utils”）
const webpack=require（'webpack'）
const config=require（“../config”）
const merge=require（'webpack-merge'）
const path=require（'路径'）
const baseWebpackConfig=require（'./webpack.base.conf'）
const CopyWebpackPlugin=require（'copy-webpack-plugin'）
const HtmlWebpackPlugin=require（'html-webpack-plugin'）
const FriendlyErrorsPlugin=require（'friendly-errors-webpack-plugin'）
const portfinder=require（'portfinder'）
const HOST=process.env.HOST
const PORT=process.env.PORT&&Number（process.env.PORT）
const devWebpackConfig=merge（baseWebpackConfig{
模块：{
规则：utils.styleLoaders（{sourceMap:config.dev.cssSourceMap，usepostsss:true}）
},
//便宜的模块评估源代码图开发速度更快
devtool:config.dev.devtool，
//这些devServer选项应该在/config/index.js中自定义
开发服务器：{
clientLogLevel:“警告”，
历史API回退：{
重写：[
{from://.*/，to:path.posix.join（config.dev.assetsPublicPath，'index.html'），
],
},
热：是的，
contentBase:false，//因为我们使用CopyWebpackPlugin。
是的，
host:host | | config.dev.host，
端口：port | | config.dev.port，
打开：config.dev.autoOpenBrowser，
覆盖：config.dev.errorOverlay
？{警告：错误，错误：正确}
：错，
publicPath:config.dev.assetsPublicPath，
代理：config.dev.proxyTable，
安静：正确，//对于FriendlyErrorsPlugin来说是必要的
监视选项：{
poll:config.dev.poll，
}
},
插件：[
新的webpack.DefinePlugin({
“process.env”：需要（“../config/dev.env”）
}),
新建webpack.HotModuleReplacementPlugin（），
new webpack.NamedModulesPlugin（），//HMR在更新时在控制台中显示正确的文件名。
新网页包。NoEmitOnErrorsPlugin（），
// https://github.com/ampedandwired/html-webpack-plugin
新HtmlWebpackPlugin({
文件名：“index.html”，
模板：“index.html”，
注：对
}),
//复制自定义静态资产
新的CopyWebpackPlugin([
{
from:path.resolve（_dirname，../static'），
到：config.dev.assets子目录，
忽略：['.']
}
])
]
})
module.exports=新承诺（（解决、拒绝）=>{
portfinder.basePort=process.env.PORT | | config.dev.PORT
portfinder.getPort（（错误，端口）=>{
如果（错误）{
拒绝（错误）
}否则{
//发布e2e测试所需的新端口
process.env.PORT=端口
//将端口添加到devServer配置
devWebpackConfig.devServer.port=端口
//添加FriendlyErrorsPlugin
devWebpackConfig.plugins.push（新的FriendlyErrorsPlugin({
编译成功信息：{
消息：[您的应用程序正在此处运行：http://${devWebpackConfig.devServer.host}:${port}`]，
},
onErrors:config.dev.notifyOnErrors
？utils.createNotifierCallback（）
：未定义
}))
解析（devWebpackConfig）
}
})
})```

你解决了这个问题吗？我可以通过构建捆绑的index.html并将其加载为一个文件

win.loadURL（文件：//${uu dirname}/dist/index.html）

来解决这个网页包问题。这很好，但是socketserver完全是另一个问题，因为您可以单击此处进行参考：。