Electron + Next.js构建打包后Link组件href路径异常问题求助

大家好，我现在遇到一个Electron结合Next.js开发桌面应用的路径问题，折腾了好几种方法都没解决，想请教下各位大佬。

问题现象 #

本地开发时，我用Next.js的<Link href="/wallets">wallets</Link>组件完全正常，但当我把应用构建并打包成Electron桌面端后，这些链接并没有按照预期转换成包含app目录和.html后缀的本地文件路径，而是保留了源码里的原始路径格式，点击后会跳转到错误的位置。

具体路径对比

• 源码中的路径：/wallets
• 构建打包后预期的路径：

  file:///Users/user/Desktop/project/dist/mac-arm64/MintBox.app/Contents/Resources/app.asar/out/wallets.html
  

• 构建打包后实际的情况：
  渲染出的HTML是<a href="/wallets"> ... </a>，点击后会被解析成file:///wallets，直接找不到对应资源。

项目结构 #

我的项目目录结构如下：

.
├── app
│   ├── layout.tsx
│   ├── page.tsx
│   ├── providers.tsx
│   └── wallets
│       └── page.tsx
├── components
│   ├── list-item.tsx
│   └── sidebar
│       └── app_sidebar.tsx
├── electron
│   ├── main.js
│   └── preload.js
├── next-env.d.ts
├── next.config.js
├── package-lock.json
├── package.json
├── postcss.config.js
├── styles
│   └── global.css
├── tailwind.config.js
├── tsconfig.json
└── yarn.lock

关键配置代码 #

Electron主进程（electron/main.js）

页面加载的核心逻辑：

function createWindow() {
    mainWindow = new BrowserWindow({
        width: 1200,
        height: 800,
        webPreferences: {
            preload: path.join(__dirname, 'preload.js'),
            nodeIntegration: false,
            contextIsolation: true,
        },
        icon: path.join(__dirname, 'assets', 'icon.png')
    });
    mainWindow.setBackgroundColor("black");

    // 首页能正常加载，但如果用Link跳转'/'也会出同样的路径问题
    const appUrl = isDev
        ? 'http://localhost:3000'
        : `file://${path.join(app.getAppPath(), 'out', 'index.html')}`;

    mainWindow.loadURL(appUrl);

    mainWindow.on('closed', () => {
        mainWindow = null;
    });
}

package.json脚本配置

"main": "electron/main.js",
  "scripts": {
    "dev": "concurrently \"next dev\" \"cross-env NODE_ENV=development electron .\"",
    "build": "next build",
    "pack-app": "npm run build && electron-builder --dir",
    "start": "electron ."
  },

next.config.js配置

const isProd = process.env.NODE_ENV === 'production';
module.exports = {
    reactStrictMode: true,
    assetPrefix: isProd ? './' : '',
    output: "export",
};

我已经尝试过的方法 #

我试过以下几种方案，但要么出现Not allowed to load local resource错误，要么还是找不到目标文件：

• 在Electron主进程中修改webSecurity配置
• 调整next.config.js里的assetPrefix参数
• 把源码中的路径改成带斜杠结尾的格式，比如/wallets/
• 用electron-builder打包时加/不加--dir参数
• 尝试自定义Electron的文件协议

现在实在没头绪了，有没有遇到过类似问题的朋友，或者知道怎么让Next.js的Link组件在Electron打包后正确解析成本地asar路径的？麻烦指点一下，谢谢大家！

备注：内容来源于stack exchange，提问作者ArtX