我不知道如何开始这个问题,但主要的问题是我无法让3种技术协同工作:Electron Typescript Webpack
我遇到了很少的样板,但是在它们中,要么整个打字稿用 tsc (而不是Webpack)构建,要么只有render-part用Webpack构建,而main-process(main.js)部分用纯js编写 .
所以我想知道是否有人知道或者知道在哪里找到一个样板项目来启动新的Electron Typescript Webpack项目?
据我所知,它应该被配置为单独构建应用程序的主进程和渲染进程部分(可能,它们的配置可能不同) .
提前致谢 .
1 回答
我在下面的链接中添加了一个示例模板/样板
https://github.com/tarunlalwani/electron-webpack-typescript-boilerplate
所以想法是打破3个文件夹中的代码
主电子流程的代码将进入
main
文件夹,UI /渲染器将进入renderer
文件夹 .现在你想在两者中使用
TypeScript
并且有2个webpack配置,一个用于捆绑main
,另一个用于捆绑renderer
.人们面临的另一个问题是
__dirname
如果对此无效则变为/
. 所以我们在webpack配置中包含以下内容这可确保相对路径可用 . 现在我们可以在开发环境中使用
os.cwd()
并在 生产环境 中使用process.resourcePath
. 有关详细信息,请参阅以下主题How to run and pack external executable using Electron?
webpack配置的目标需要不同 . 所以对于main我们使用
electron-main
而对于渲染器我们使用electron-renderer
main
和renderer
的tsconfig.json
需要不同,并且应该相互排除 . 所以我们用renderer/tsconfig.json
main/tsconfig.json
最后的主要是你的
package.json
,它在下面这应该是你的开始,然后你可以添加东西链接
tslint
,jslint
随着你去