我一直在从事 Svelte 3 + Electron 12.0.5 项目。我正在使用 svelte-spa-router哈希路由包。我的项目结构如下所示:
node_modules/
public/
build/
bundle.css
bundle.js
index.html
src/
Components/
Pages/
Home.svelte
Settings.svelte
...
Sidebar.svelte
Titlebar.svelte
App.js
App.svelte
...
index.js // <-- Electron entry point
rollup|svelte|tailwind // <-- config files
由于我使用的是路由器,electron 的 window.loadFile()
没有工作;为了解决这个问题,我使用了 sirv-cli连同 concurrently .现在我的启动脚本如下所示:
"start": "concurrently \"sirv public --no-clear --port=40072\" \"electron .\""
现在我用了window.loadURL("https://localhost:40072")
让这个工作。 .svelte
文件,在 <script>
内标签,我试着做import * as electron from "electron"
;但这导致错误说 fs
没有定义。所以现在,我在 index.js
中创建了一个快速服务器并且正在使用 fetch
制作POST
向服务器请求并执行我可以使用 ipcMain
轻松完成的事情和 ipcRenderer
...我不知道我是否做错了什么(nodeIntegration 已设置为 true)。我对 Svelte 有点陌生,所以有人知道在脚本标签内使用 Electron 方法的任何其他方法吗?
最佳答案
所以,我终于解决了我的问题。我将此作为答案发布,以便其他有相同问题的人可以解决它。首先,我们不需要 express 了(如果你愿意也可以用)。启动脚本是相同的,即
"start": "concurrently \"sirv public --no-clear --port=40072\" \"electron .\""
因此,我们将使用preload
,而不是使用nodeIntegration
。例如让我们考虑一个自定义标题栏的场景!
--- 预加载.js ---
const { contextBridge, ipcRenderer } = require("electron");
contextBridge.exposeInMainWorld(
"api", { // "api" --> rename it to anything you want
titlebar: action => {
ipcRenderer.send("titlebar", action);
}
}
);
--- index.js ---
const { app, ipcMain } = require("electron");
...
ipcMain.on("titlebar", (event, arg) => {
if(arg === "destroy") window.destroy();
else if(arg === "kill") app.quit();
else if(arg === "minimize") window.minimize();
else if(arg === "resize") {
if(window.isMaximized()) window.unmaximize();
else window.maximize();
}
})
最后是你的 svelte 文件;考虑 Titlebar.svelte
<button on:click={() => window.api.titlebar("destroy")}>Destroy</button>
<button on:click={() => window.api.titlebar("kill")}>Kill</button>
<button on:click={() => window.api.titlebar("minimize")}>Minimize</button>
<button on:click={() => window.api.titlebar("resize")}>Resize</button>
这实际上是我的用例。我希望它有所帮助!不胜感激!
关于javascript - 如何在 svelte 文件中使用 electron 方法 - Svelte 3 - 或者还有其他方法吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67214544/