I am using the latest NextJS 14. And in next.config.mjs file as above, I wrapped my nextConfig in two plugins, but when I deployed them to Vercel, it simply cannot be built. I am relatively new to this situation, so I stop using plaiceholder so switched to Jimp to blur my image, which works smooth. Nevertheless, I would like to know what's the solution here, in case I ever want to work in this setup again.
import createNextIntlPlugin from "next-intl/plugin";
import withPlaiceholder from "@plaiceholder/next";
const withNextIntl = createNextIntlPlugin();
/** @type {import('next').NextConfig} */
const nextConfig = {
images: {
remotePatterns: [
{
hostname: "firebasestorage.googleapis.com",
},
{
protocol: "https",
hostname: "cdn.sanity.io",
},
],
},
env: {
POSTGRES_PRISMA_URL: process.env.POSTGRES_PRISMA_URL,
POSTGRES_URL_NON_POOLING: process.env.POSTGRES_URL_NON_POOLING,
},
};
export default withPlaiceholder(withNextIntl(nextConfig));
I stop using plaiceholder so switched to Jimp to blur my image, and Redis to cache it, which works smooth.