我是 Electron 的新手，正在尝试帮助维护开发人员已离开的应用程序。 resources/app文件夹包含(至少)三件事:
app/lib/bundle.js，其中包含捆绑和缩小的整个应用程序。这就是应用程序实际运行的内容。- 由开发人员编写的所有代码的 Node 模块。这些位于 TypeScript 中，位于结构
node_modules/@mainmodule/submodule/src/.../something.ts中。其中每一个都有一个node_modules/@mainmodule/submodule/package.json和node_modules/@mainmodule/submodule/tsconfig.json - 最后，对于其中每一个，都有一个相应的 lib 文件夹:
node_modules/@mainmodule/submodule/src/.../something.js。 lib文件夹里有每个TypeScript对应的Javascript，以及map显示它们如何对应的文件。这些 Javascript 文件被缩小并包含在 bundle 中，实际运行。
源代码 TypeScript 相对清晰，我可以理解其中的大部分内容。但要真正理解它，我需要在其上设置断点并在调试器(例如 VS Code)中运行它。但是，在运行应用程序时，Electron 不会从 TypeScript(在 src 中)运行它，甚至不会从单个 Javascript(在 lib 中)运行它，而是从 bundle.js 运行它。 。 Bundle.js 是一个巨大的文件，除了被缩小之外，它太大了，甚至无法在我的编辑器中正确加载。
我的问题
我如何告诉 Electron 不从 bundle.js 运行应用程序，但是来自个人src/...ts TypeScript，或者，如果失败，来自个人 src/...js JavaScript？
如果这是不可能的，那么当捆绑 Electron 应用程序时，在给定源的情况下，使用调试器的正确方法是什么？我有完整的源代码，但是当我调用 Electron 时，它用完了包:我如何更改它？
我是 Electron 和 Node 的新手，所以如果我犯了一个基本错误，请澄清。
更新目前的进展
我在追根溯源方面取得了很大进展，但还没有完全实现。
Electron 应用程序以 electron-main.js 开头，它会加载类似 server.js 的内容和其他文件。这些都是从源头运行的。
最终，它使用以下代码创建一个最小窗口:
<head>
...
<script type="text/javascript" src="./bundle.js" charset="utf-8"></script>
</head>
bundle.js然后加载到窗口中。这些文件太大且难以理解(缩小)，没有多大用处。但是，正如我所说，来源也都是可用的。
但是，bundle.map.js包含已完成:它包含 sources, names, mappings, sourcesContent ，原则上这足以重建一切。而且，对于几乎所有的sources ，相应的源文件是可用的并且显而易见的。
我相信我需要更换 <script type="text/javascript" src="./bundle.js" charset="utf-8"></script>与 includer.js其中:
- 包括我可以找出其匹配源文件的所有文件
- 将sourcesContent用于其他用途
/迄今为止的进展...
最佳答案
由于项目目前设置为从 bundle 中运行内容，因此该项目可能只能从 bundle 中运行内容，除非您更改配置(这只能完成如果您首先对整体结构有所了解，并试图从一开始就掌握它)。换句话说，查看事物如何互锁并分析和更改应用程序中的逻辑的最可能的方法是生成一个新 bundle 。
通常，生成新包的过程将包含在项目根文件夹的 package.json 中。如果您有:
the-big-app/node_modules
那么你也许可以看看
the-big-app/package.json
并查看其中包含的脚本。可能会有一些(非常笼统的)内容:
{
"name": "the-big-app",
"scripts": {
"lint": "eslint .",
"build": "webpack && tsc --build tsconfig.node.json",
"watch": "nodemon --exec npm run start -e ts,tsx,scss,html",
"run": "npx electron build/node/main.js",
"start": "npm run build && npm run run"
},
每个属性都引用一个可运行的 NPM 脚本。您可能有一个 build 脚本 - 如果您有这样的脚本并输入 npm run build，它应该会生成一个新的包，然后可以执行该包。如果没有 build 脚本，请四处查看哪些其他脚本看起来可能会做一些有用的事情，然后执行它们。 (为了以防万一，请先备份目录中现有的 bundle 和其他文件。)
查看每个 NPM 脚本属性的值，以便您可以进一步研究它们的作用以及它们与将源代码转换为可运行的内容之间的关系。就例如上面的例子，做
"build": "webpack && tsc --build tsconfig.node.json",
在我的应用程序中，将会
(1) 运行Webpack为渲染器进程构建bundle
(2) 运行 tsc 将 the-big-app/src/main-process/ 中的 TypeScript 代码编译为 JavaScript，然后由 Electron 执行
在 package.json 中查找类似的内容以查看发生了什么，这将告诉您如何调整和调试它。
As Electron's docs say ，可以通过devtools调试浏览器代码。调试主流程is harder - 您可能需要使用 inspect 标志等来调用 Electron。
至于是否/如何可以直接从源 TypeScript 运行而不是从 bundle 运行的问题 - 可以为主进程执行此操作 with ts-node (2) 。我认为渲染器进程不可能，因为“页面”需要看到一个普通的 .js 文件，就像任何网页一样 - 并且，同样，不能直接运行 TypeScript，也像普通浏览器和网页无法直接运行 TypeScript。
关于javascript - 如何从源代码(而不是 bundle )运行 Electron 应用程序，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/71489815/