如何仅在特定路径部署运行Nuxt3静态应用？

你的问题出在Nuxt配置项的使用上，从defineNuxtConfig判断你用的是Nuxt 3，正确的配置方式如下：

修正nuxt.config.ts配置 #

将你的配置替换为以下内容：

export default defineNuxtConfig({
  css: [
    '~/assets/global.scss'
  ],
  // 指定静态生成预设，替代旧的target: 'static'
  nitro: {
    preset: 'static'
  },
  // 设置部署的基础路径，替代Nuxt 2的router.base
  app: {
    baseURL: '/test/'
  }
})

关键修正点说明 #

• 移除target: 'static'：Nuxt 3中已废弃该配置，改用nitro.preset: 'static'来指定静态站点生成模式。
• 替换router.base为app.baseURL：Nuxt 3中控制应用基础路径的配置项是app.baseURL，而非Nuxt 2时期的router.base，这是你之前资源路径仍指向根目录的核心原因。
• 无需设置public_path：该配置是Nuxt 2的写法，Nuxt 3会自动结合app.baseURL处理静态资源路径，生成的资源会自动带上/test/前缀。

重新部署步骤 #

1. 执行npm run generate重新生成静态文件
2. 将.output/public目录下的所有文件复制到服务器的test文件夹中

此时生成的index.html里的资源引用会变成：

<meta name="head:count" content="2">
<link rel="modulepreload" href="/test/_payload.js">
<link rel="modulepreload" as="script" crossorigin href="/test/_nuxt/entry.8af327a9.js">

访问www.example.com/test即可正常加载所有资源。

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