Nuxt 3 payload.js路径配置求助：解决根目录定位与路由重定向问题

问题描述 #

我在使用Nuxt 3时碰到个麻烦：框架默认把payload.js生成在根目录，但我得把它放到_nuxt文件夹或者其他子目录里。

试了修改nuxt.config.ts里的baseURL配置，payload.js的路径倒是正常了，但Vue Router会自动把首页重定向到baseURL对应的路径，这不是我要的效果。

我的配置代码如下：

app: {
    baseURL: '/mysubfolder/something',
},

求个靠谱的解决办法——要么能单独改payload.js的输出路径，要么能调整Vue Router的base URL同时避免首页重定向。

解决方案 #

方法一：单独指定payload.js的输出路径（推荐） #

不用改baseURL，直接通过Nitro的配置来调整静态资源的输出位置。在nuxt.config.ts里添加这段配置：

nitro: {
  output: {
    publicAssets: [
      {
        baseURL: '/_nuxt', // 要放到的目标子目录
        dir: '.nuxt/dist/client', // payload.js原本的生成目录
        filter: /payload\.js$/ // 只匹配payload.js文件
      }
    ]
  }
}

配置完重新构建项目，payload.js就会自动跑到_nuxt目录下，同时Vue Router的首页不会被重定向，完全不影响原有路由逻辑。

方法二：保留baseURL并修复首页重定向 #

如果非得用baseURL配置，那就加个中间件来调整重定向逻辑：

1. 先保留nuxt.config.ts里的baseURL配置不变；
2. 在项目根目录新建server/middleware/redirect.ts文件，写入以下代码：

export default defineEventHandler((event) => {
  const requestPath = event.node.req.url
  // 把指向baseURL的请求重定向回首页
  if (requestPath === '/mysubfolder/something') {
    event.node.res.writeHead(302, { Location: '/' })
    event.node.res.end()
  }
})

这个中间件会修正首页的重定向行为，不过这种方法需要额外维护中间件，不如第一种直接省心。

注意事项 #

• 如果是静态站点生成（SSG）模式，改完配置记得重新运行nuxt generate验证效果；
• 方法一的配置可以根据需求修改baseURL的值，比如你想放到assets子目录，就把baseURL改成/assets。

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