Next.js文件路径自定义：移除开头斜杠适配Electron

问题背景 #

当前Next.js静态导出后，资源路径默认以/_next开头（比如"/_next/static/css/650b9dca11a5e4cf.css"），但Electron本地文件访问要求路径以_next开头（不带前置斜杠），需要调整配置实现这一需求。

当前配置 #

Next.js配置文件 #

/** @type {import('next').NextConfig} */
const nextConfig = {
    output : 'export',
    basePath: '',
};

export default nextConfig;

package.json配置 #

"homepage": ""

调整方案 #

只需修改两处配置即可实现相对路径输出：

1. 更新Next.js配置
   添加assetPrefix设置相对路径，同时开启trailingSlash避免静态导出的路径问题：

/** @type {import('next').NextConfig} */
const nextConfig = {
    output: 'export',
    basePath: '',
    assetPrefix: './', // 让资源路径使用相对当前页面的路径
    trailingSlash: true, // 确保所有页面导出为带.html后缀的文件，适配本地访问
};

export default nextConfig;

2. 更新package.json
   将homepage设置为相对路径标识：

"homepage": "."

调整后构建生成的资源路径会变为./_next/static/css/xxx.css，在Electron本地环境中会自动解析为以_next开头的路径，满足访问需求。

内容的提问来源于stack exchange，提问作者person