使用Electron将Angular Project(进行RESP API调用)转换为桌面应用程序

Question

我有一个功能齐全的 Angular 前端，它向在端口 8080 上运行的 Spring Boot 后端进行 REST API 调用。我需要将此 Web 应用程序转换为桌面应用程序。我知道它很容易使用electron。我关注了这个问题下的几个线程，但找不到答案。如何通过修改此主文件来实现此.js文件？还是我需要修改项目中进行 api 调用的每个位置？我已将应用程序加载到窗口，但它不与后端通信。

const {
app,
BrowserWindow
} = require('electron')
const url = require("url");
const path = require("path");
let appWindow
function initWindow() {
appWindow = new BrowserWindow({
width: 1000,
height: 800,
webPreferences: {
nodeIntegration: true
}
})
// Electron Build Path
appWindow.loadURL(
url.format({
pathname: path.join(__dirname, `/dist/index.html`),
protocol: "file:",
slashes: true
})
);
// Initialize the DevTools.
appWindow.webContents.openDevTools()
appWindow.on('closed', function () {
appWindow = null
})}
app.on('ready', initWindow)
// Close when all windows are closed.
app.on('window-all-closed', function () {
// On macOS specific close process
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', function () {
if (win === null) {
initWindow()
}
})

Answer 1

我认为转换 Angular 应用程序的最佳方法是，使用 Angular-electron 样板，将您的内容从您的应用程序移动到 electron 应用程序并进行配置。我建议你使用最大值/角电子样板。

对于 API 调用，您暂时不需要弄乱main-process。Angular 应用程序将在renderer process上运行，并将您的应用程序逻辑保留在那里。