我正在使用基于Solid-JS的Web应用程序独立使用Electron,但即使成功构建,应用程序也无法正常工作。当我使用开发者工具检查时,显示错误“加载资源失败:net::ERR_FILE_NOT_FOUND”添加到我的css和索引.tsx文件中。
在React案例中,通常只需添加{“主页”:“./"}到package.json可以工作,但它不适用于我的情况。
我只是共享我的package.json和electron.ts文件来查找问题。(它位于public/目录中)
package.json
{
"name": "my-solid-project",
"author": "AAAA",
"version": "0.1.0",
"description": "",
"type": "commonjs",
"main": "./public/electron.js",
"homepage": "./",
"scripts": {
"start": "vite",
"dev": "vite",
"build": "vite build",
"serve": "vite preview",
"test": "vitest",
"postinstall": "node ./fix-jest-dom.mjs",
"start-renderer": "cross-env BROWSER=none yarn start",
"start-main": "electron .",
"compile-main": "tsc ./public/electron.ts",
"start-main-after-renderer": "wait-on http://localhost:3000 && yarn start-main",
"electron-dev": "concurrently -n renderer, main 'yarn:start-renderer' 'yarn:start-main-after-renderer'",
"electron-dist": "yarn build && electron-builder --dir --config .electron-builder.config.cjs",
"predist": "yarn compile-main",
},
electron.ts
import * as path from 'path';
import * as url from 'url';
import { app, BrowserWindow } from 'electron';
import * as isDev from 'electron-is-dev';
import { join } from 'path';
const baseUrl: string = 'http://localhost:3000';
let mainWindow: BrowserWindow | null;
function createMainWindow(): void {
mainWindow = new BrowserWindow({
width: 1080,
height: 700,
webPreferences: {
nodeIntegration: true,
},
});
mainWindow.loadURL(`file://${path.join(__dirname, '../index.html')}`);
mainWindow.webContents.openDevTools();
if (isDev) {
mainWindow.webContents.openDevTools();
}
mainWindow.on('closed', (): void => {
mainWindow = null;
});
}
app.on('ready', (): void => {
createMainWindow();
});
app.on('window-all-closed', (): void => {
app.quit();
});
app.on('activate', (): void => {
if (mainWindow === null) {
createMainWindow();
}
});
1条答案
按热度按时间62o28rlo1#
该问题似乎与SolidJS无关,而是由于某些格式错误的文件路径。
编辑:他在配置文件中使用了绝对路径。
我发现我的项目中的vite build导入资源文件时使用了绝对路径。
你需要将typescript文件编译成JavaScript文件,以便在电子渲染器中运行。因此,没有办法直接在电子中运行
index.tsx
。您的应用程序加载了
index.html
文件,但并不清楚您如何运行开发服务器。开发人员通常使用类似于以下内容的内容:确保您的
index.html
文件包含具有正确路径的客户端代码。在React案例中,通常只需添加{“主页”:“./"}到package.json的工作方式
这不是一个内置的电子功能。你必须使用一些软件包来挂载一个React路由器。
如果可执行文件中缺少文件,请确保在最终的可执行文件中捆绑了所需的文件。您需要显式指定捆绑包中将包括哪些文件。
这里是一个基本的电子邀请固体应用程序:https://github.com/snnsnn/electron-vite-solid