nextjs - 💡(How to fix) Fix 16.2 Files written to public/ after `next build` are not served on Vercel deployments [6 comments, 6 participants]

Fix Plan

The fix involves modifying the next.config.js file to include the generated files in the public directory.

• Update next.config.js to include the following code:

module.exports = {
  //... other configurations ...
  experimental: {
    externalDir: true,
  },
}

Alternatively, you can also use the distDir option to specify the output directory for the generated files:

module.exports = {
  //... other configurations ...
  distDir: 'build',
}

Then, update the postbuild script to write files to the build directory instead of public:

"scripts": {
  "build": "next build && npm run postbuild",
  "postbuild": "node ./scripts/generate-files.js build"
}

And update the generate-files.js script to write files to the build directory:

const fs = require('fs');
const path = require('path');

const buildDir = process.argv[2] || 'build';
const data = { /* your data */ };

fs.writeFileSync(path.join(buildDir, 'data.json'), JSON.stringify(data));

Verification

To verify that the fix worked, deploy your application to Vercel and check that fetching /data.json returns a 200 status code.

Extra Tips

Make sure to update your generate-files.js script to handle the new output directory. Also, be aware that using the experimental option may have unintended consequences, so use it with caution.