将一个 Sveltekit 应用程序合并到另一个 Sveltekit 应用程序

Question

我有两个 Sveltekit 应用程序。 A. 是一个普通的网站应用程序 B. 存在于电子内部

我想要 A 正常的 Sveltekit 网站，导入在 Electron 中运行的 B Sveltekit 应用程序。 为什么？因此我对电子应用程序所做的任何更改都会自动同步到网络应用程序，并且我不需要手动更新 A 中的 src 文件夹。

为了让 Sveltekit 正确编译，似乎所有文件都需要位于 src 目录中。我可以将 B、电子应用程序放置在 A、Web 应用程序 src 文件夹中，并且它可以工作。它在构建时可以正确编译并且运行良好。然而，在本地主机上需要 1 分钟才能启动，我认为这是因为本地主机尝试加载电子中包含的所有内容，这使得编辑网站变得非常糟糕并且因不必要的文件而变得臃肿。 我也尝试过在操作系统中同步两个文件夹，但在 mac 上这似乎不切实际。

性能受到影响。我可以通过某些服务器加载功能将电子应用程序的预编译版本导入到网站中吗？ Sveltekit 和 Vites 后端系统变得非常复杂，因此非常感谢任何建议。

Answer 1

这个问题没有简单的答案，因为它取决于您使用电子应用程序做什么，但它可以分为三类：

---

1.移植到 sveltekit 并像这样运行。 （需要电子吗？）

删除电子开销和端口到 sveltekit 并从网络运行。

2.如果您已经在使用 sveltekit + electro 模板或适配器

例如。 https://github.com/ptkdev/sveltekit-electron-adapter

您可以使用它来运行您的电子应用程序并预渲染网站（例如静态）

或者使用不同的模板构建代码。

3.将代码或端口拆分为模板

如果您同时需要 Electron 和 Web 应用程序，请将代码拆分为可以在构建/运行时互换的 svelte 组件，这样您就拥有了用于 Web 和 Electron 包的 sveltekit 包。

电子/桌面相关组件不包含/重写或禁用网络，反之亦然。

其他可以互换/与 svelte 和 electro 兼容的组件可以保持原样。让您的主要文件尽可能广泛并构建网络和电子。

类似： https://github.com/FractalHQ/sveltekit-electron

---

或者最后移植到 sveltekit，让您的电子应用程序启动服务器 喜欢：

npm run dev

然后指向它。

为此使用

<webview>

或 BrowserView

浏览器视图示例:

// In the main process.
const { app, BrowserView, BrowserWindow } = require('electron')

app.whenReady().then(() => {
  const win = new BrowserWindow({ width: 800, height: 600 })

  const view = new BrowserView()
  win.setBrowserView(view)
  view.setBounds({ x: 0, y: 0, width: 300, height: 300 })
  view.webContents.loadURL('https://electronjs.org')
})