electron 使用solid-js的电子构建显示错误“加载资源失败:net::未找到错误文件”

hi3rlvi2  于 2022-12-08  发布在  Electron
关注(0)|答案(1)|浏览(311)

我正在使用基于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();
  }
});
62o28rlo

62o28rlo1#

该问题似乎与SolidJS无关,而是由于某些格式错误的文件路径。
编辑:他在配置文件中使用了绝对路径。
我发现我的项目中的vite build导入资源文件时使用了绝对路径。
你需要将typescript文件编译成JavaScript文件,以便在电子渲染器中运行。因此,没有办法直接在电子中运行index.tsx
您的应用程序加载了index.html文件,但并不清楚您如何运行开发服务器。开发人员通常使用类似于以下内容的内容:

if (isDev) {
  mainWindow.loadURL('http://localhost:3000');
} else {
  mainWindow.loadFile(path.join(__dirname, 'index.html'));
}

确保您的index.html文件包含具有正确路径的客户端代码。
在React案例中,通常只需添加{“主页”:“./"}到package.json的工作方式
这不是一个内置的电子功能。你必须使用一些软件包来挂载一个React路由器。
如果可执行文件中缺少文件,请确保在最终的可执行文件中捆绑了所需的文件。您需要显式指定捆绑包中将包括哪些文件。
这里是一个基本的电子邀请固体应用程序:https://github.com/snnsnn/electron-vite-solid

相关问题