Next.js 13.4.7项目构建未包含API文件，本地正常部署异常

我有一个版本为13.4.7的Next.js项目，在路径src/app/api/send-mail/route.js下创建了一个用于发送邮件的POST API接口。该接口在本地环境运行正常，但部署网站时，构建产物中未包含此API文件。

我的API文件代码 #

import { NextResponse } from "next/server";
import sgMail from "@sendgrid/mail";

sgMail.setApiKey(process.env.SENDGRID_API_KEY);

export async function POST(request) {
let response;
try {
const req = await request.json();

console.log(req, "REQ");

const msg = {
  to: "test@yopmail.com",
  from: "test1@gmail.com",
  subject: "test subject",
  html: `Sample HTML"
};

sgMail
  .send(msg)
  .then(() => {
    response = { "message": "Email sent succesfully.", "status": 200 };
  })
  .catch((error) => {
    console.log(error, "ERROR");
    response = { "message": "Something went wrong.", "status": 400 };
  });
 } catch (err) {
   response = { "message": "Something went wrong." };
   console.log(err, "ERROR");
 }
return NextResponse.json({...response});
}

构建输出 #

执行npm run build后，构建产物中未包含该API路由，构建日志也未显示对该文件的处理记录。

问题原因及解决方案 #

1. 语法错误（核心问题） #

代码中存在未闭合的模板字符串：html: Sample HTML"` 里的反引号没有闭合，这会导致构建时语法检查失败，Next.js会跳过该文件的编译。

修复方法：
将模板字符串闭合：

html: `Sample HTML`

2. 异步竞态问题（附加优化） #

原代码用then/catch处理异步操作，会导致函数提前返回，此时response可能还未赋值，出现返回值异常。建议改用await简化逻辑：

修正后的完整代码：

import { NextResponse } from "next/server";
import sgMail from "@sendgrid/mail";

sgMail.setApiKey(process.env.SENDGRID_API_KEY);

export async function POST(request) {
  let response;
  try {
    const req = await request.json();
    console.log(req, "REQ");

    const msg = {
      to: "test@yopmail.com",
      from: "test1@gmail.com",
      subject: "test subject",
      html: `Sample HTML`
    };

    await sgMail.send(msg);
    response = { message: "Email sent successfully.", status: 200 };
  } catch (err) {
    response = { message: "Something went wrong.", status: 400 };
    console.log(err, "ERROR");
  }
  return NextResponse.json(response);
}

3. 路由结构验证 #

确认文件路径严格遵循App Router规则：src/app/api/send-mail/route.js，检查文件夹名、文件名是否存在拼写错误（比如误写为routes.js）。

4. 构建配置检查 #

打开next.config.js，确保没有配置排除src/app/api目录的规则，同时确认experimental.appDir未被手动关闭（Next.js 13.4+默认开启App Router）。

5. 依赖确认 #

运行npm list @sendgrid/mail，确保@sendgrid/mail在dependencies中（而非devDependencies），生产构建会忽略开发依赖包，可能导致路由编译失败。

完成以上步骤后，重新执行npm run build，即可看到API路由被纳入构建产物。

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