【问题标题】:Electron Create React App not loading after buildElectron Create React App在构建后未加载
【发布时间】:2021-11-25 18:26:33
【问题描述】:

我使用npx create react app 创建了一个测试反应项目,并添加了 electron.js 文件。然后我运行构建脚本,它编译成功,但是当我尝试运行 .exe 时,没有任何显示,控制台返回 Failed to load resource: net::ERR_FILE_NOT_FOUND

electron.js

const { app, BrowserWindow } = require("electron");
const path = require("path");
const isDev = require("electron-is-dev");

function createWindow() {
  const mainWindow = new BrowserWindow({
    width: 1920,
    height: 1080,
    webPreferences: {
      preload: path.join(__dirname, "preload.js"),
    },
  });

  mainWindow.loadURL(
    isDev
      ? "http://localhost:3000"
      : `file://${path.join(__dirname, "../build/index.html")}`
  );

  mainWindow.webContents.openDevTools();
}

app.whenReady().then(() => {
  createWindow();

  app.on("activate", function () {
    if (BrowserWindow.getAllWindows().length === 0) createWindow();
  });
});

app.on("window-all-closed", function () {
  if (process.platform !== "darwin") app.quit();
});

编辑:所以我从一开始就再次尝试并设法仅使用 create-react-app 进行构建,但是我现在已经使用 Routes 组件更改了一些文件,并且在开发时我构建它时工作正常,没有任何显示。显示了 console.log,但没有显示组件。

routes.js

const routes = [
  {
    exact: true,
    path: "/",
    component: lazy(() => import("../test")),
  },
];

const renderRoutes = (routes) =>
  routes ? (
    <Suspense fallback={<div>Loading...</div>}>
      <Switch>
        {routes.map((route, i) => {
          const Layout = route.layout || Fragment;
          const Component = route.component;

          console.log({ Component });

          return (
            <Route
              key={i}
              path={route.path}
              exact
              render={(props) => (
                <Layout>
                  {route.routes ? (
                    renderRoutes(route.routes)
                  ) : (
                    <Component {...props} />
                  )}
                </Layout>
              )}
            />
          );
        })}
      </Switch>
    </Suspense>
  ) : null;

const Routes = () => {
  return renderRoutes(routes);
};

export default Routes;

【问题讨论】:

    标签: javascript node.js reactjs build electron


    【解决方案1】:

    问题可能在于您更改了其中一个主要文件的名称,例如电子在构建时搜索特殊文件名。请检查您的文件名。

    此错误表示未找到该文件。路径错误或文件不在您想要的位置。

    【讨论】:

    • 但我没有更改任何文件名。我做了 npx create react app 然后将 electron.js 文件添加到公共文件夹并更新了 package.json
    • 只有当您弄乱文件名或安装损坏或缺少元素时才会出现这种行为和异常。然而,还有一个原因——当你有不同的 CPU 架构时,即基于 ARM 的 CPU。请检查您的电子到底在哪里搜索丢失的模块,并请提供扩展的控制台输出。当然,您可以更改路径名(以防隐私)。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-09-09
    • 2019-10-28
    • 1970-01-01
    • 1970-01-01
    • 2018-09-21
    • 1970-01-01
    • 2016-06-19
    相关资源
    最近更新 更多