Question

大家好，可以帮帮我吗？

我正在尝试配置我的虚假 API 以创建一些个人项目，但在我的情况下，使用 /pages/api 文件夹的方法仅适用于我在 localhost 中部署到服务器时在 Vercel 上，项目找不到我的端点。

就我而言，我使用 src/ 文件夹方法来开发我的应用程序，我不知道这种结构是否会导致 api 文件夹出现问题。

我尝试和工作的一件事是使用应用程序根目录下的 api 文件夹（在 /src 文件夹外）部署到 vercel，但 api 在 localhost 上停止工作。

此结构适用于本地主机但不适用于服务器：

├───public/
├───src/
    ├───api/
    ├───pages/
    ...
next.config.js
package.json

此结构适用于服务器，但不适用于本地主机：

├───api/
├───public/
├───src/
    ├───pages/
    ...
next.config.js
package.json

这是我用来获取数据的方法：

AXIOS API：

import axios from 'axios'

const api = axios.create({
  baseURL: '/api/'
})

export default api

SWR 挂钩：

import api from 'src/services/api'
import useSWR from 'swr'

function SwrFetchHook<Data = any, Error = any>(url: string) {
  const { data, error } = useSWR<Data, Error>(url, async url => {
    const response = await api.get(url)
    return response.data
  })

  return { data, error }
}

export default SwrFetchHook

SWR 回调：

const { data } = SwrFetchHook<INavItem[]>('categories')

我希望我能解释一下，我的问题是如何使用此功能的最佳方式，因为 /src 文件夹通常与 nextjs 一起使用，但我不知道这是否是 api 的真正问题文件夹。

谢谢！

Answer 1

不能 100% 确定这是否是同一问题。我在构建阶段收到了这个警告：

warn  - Statically exporting a Next.js application via `next export` disables API routes. This command is meant for static-only hosts, and is not necessary to make your application static.

确保您在 package.json 脚本中使用了正确的构建命令。

我就是这样：

"next build && next export" 需要更改为 "build": "next build"

注意：我删除了 && next export

这会禁用静态导出功能并允许在运行 pages/api 时使用 yarn start 注意：yarn start 依赖于 Vercel 构建管道中的构建脚本。所以除非需要，否则不要覆盖默认设置。

对于普通的 Node/JS 项目，您可以在脚本区域中定义一个源文件夹，即 "start": "<SOME_COMMAND> ./src"....但是 Next.js 会自动执行此操作，所以我认为没有 src 文件是问题。我的项目中也有一个 src 文件，这是组织 JS 项目的一种非常常见的方式（首选方式）。如果您在使用 next，则不必触摸它。

Nextjs api“pages/api”在 vercel 服务器上不起作用

1 个答案: