我的nextjs版本-13.2.1
首先,下面的代码在本地环境中可以正常工作。
// src/pages/api/md/index.ts
// get markdowns data
import type { NextApiRequest, NextApiResponse } from "next";
import { join } from "path";
import fs from "fs/promises";
import matter from "gray-matter";
import { MarkDownProps } from "@/types/pages";
type Error = {
error: string;
};
type Data = MarkDownProps[] | Error;
type Send<Data> = (data: MarkDownProps[]) => void;
type newApiResponse = {
send: Send<Data>;
json: Send<Data>;
status: (statusCode: number) => NextApiResponse<Data>;
};
export default async function handler(
req: NextApiRequest,
res: newApiResponse,
) {
if (req.method === "GET") {
try {
const result = await getMdList();
res.status(200).send(result);
} catch (error) {
res.status(500).send({ error: "failed to fetch data" });
}
}
}
export const getMdList = async () => {
...some code
return posts;
};
async function getMdFiles(dirPath: string): Promise<string[]> {
...some code
return mdFiles;
}
// Components that use the API
// get markdowns data
const listfetch = async () => {
const response = await axios.get("/api/md");
if (pathname.split("/")[1] === "blog") {
setRecommandList(
response.data.filter(
(item: MarkDownProps) => item.category === "github",
),
);
} else {
setRecommandList(
response.data.filter(
(item: MarkDownProps) => item.category === pathname.split("/")[1],
),
);
}
};
useEffect(() => {
listfetch();
}, []);
该代码在本地很好地接收数据。但在部署中未找到
错误:GET https://{我的URL}/API/md 404
想想这需要什么,我在接下来添加了pageExtensions。配置但不工作太
我的配置是
/** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: false,
images: {
unoptimized: true,
},
compiler: {
styledComponents: true,
},
pageExtensions: ["js", "jsx", "ts", "tsx", "md", "mdx"],
};
module.exports = nextConfig;
这个问题怎么解决??
1条答案
按热度按时间gdx19jrr1#
无法在静态部署环境中使用页面/API目录