Error When Writing Files in Node Environment with Next.js Deployed on Serverless Cloud Functions

Question

I am building a Next.js app using the version 12.1.6 and Firebase Cloud Functions as a serverless function.

In the local environment, it works without any problem, but after it's deployed, it returns Failed to load resource: the server responded with a status of 503 () to the client. And there is an error message in the functions log saying:

Error: EROFS: read-only file system, unlink '/workspace/dist/next/BUILD_ID'] {
  errno: -30,
  code: 'EROFS',
  syscall: 'unlink',
  path: '/workspace/dist/next/BUILD_ID'
}

From the error log, it seems that Next.js somehow tries to do write operations in the node environment. But Firebase Cloud Functions does not accept any writing operations except /temp directory. It only allows read operation.

Maybe I just should deploy to other hosting like Vercel. But can older versions resolve this issue? Because I am using the version 9.3 in another Firebase project and it works fine.

I would like to know how to avoid this error using the latest Next version and Firebase Cloud Functions?

packag.json

 "engines": {
    "node": "16"
  },
  "dependencies": {
    "firebase-admin": "^10.0.2",
    "firebase-functions": "^3.20.1",
    "next": "^12.1.6",
    "react": "17.0.2",
    "react-dom": "17.0.2"
  },
  "devDependencies": {
    "@types/node": "17.0.13",
    "@types/react": "17.0.38",
    "eslint": "8.8.0",
    "eslint-config-next": "12.0.9",
    "typescript": "4.5.5"
  }

firebase.json

{
  "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "functions": {
    "source": ".",
    "predeploy": ["npm run build"],
    "runtime": "nodejs16"
  },
  "hosting": {
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "rewrites": [
      {
        "function": "nextHosting",
        "source": "**"
      }
    ]
  }
}