Skip to content

Recommended Vercel Serverless setup for sharp@0.35.x with React Router framework mode? #4543

@reimurashiki

Description

@reimurashiki

Question about an existing feature

Summary

After upgrading from sharp@0.34.5 to sharp@0.35.0, image processing fails at runtime in a React Router v7 Framework Mode application deployed using @vercel/react-router.

The deployment build succeeds, and the build logs show that sharp@0.35.0 is installed. However, the deployed Vercel Serverless Function appears not to contain the required @img/sharp-libvips-linux-x64 files.

Pinning Sharp back to 0.34.5 resolves the issue.

What are you trying to achieve?

I use Sharp to validate and resize uploaded images in a React Router v7 Framework Mode application deployed to Vercel Serverless Functions.

The following versions work in production:

sharp@0.34.5
@img/sharp-linux-x64@0.34.5
@img/sharp-libvips-linux-x64@1.2.4

After upgrading to:

sharp@0.35.0
@img/sharp-linux-x64@0.35.0
@img/sharp-libvips-linux-x64@1.3.0

image uploads began failing at runtime.

Runtime error

Cannot find module '/var/task/node_modules/@img/sharp-libvips-linux-x64/lib/index.js'

Could not load the "sharp" module using the linux-x64 runtime

ERR_DLOPEN_FAILED: libvips-cpp.so.8.18.3: cannot open shared object file:
No such file or directory

The failure occurs when Sharp is imported or first used, before any image-specific processing completes.

Questions

  1. Is sharp@0.35.x expected to work on Vercel Serverless Functions when used by non-Next.js frameworks such as React Router or Remix?
  2. Is there a recommended way to ensure that @img/sharp-libvips-linux-x64 is included in the final deployed function bundle?
  3. Does the package structure or loading behavior in Sharp 0.35 require file-tracing tools to include additional paths compared with Sharp 0.34?
  4. Does this appear to be a Sharp packaging issue, or is it more likely a Vercel file-tracing issue that should be reported to Vercel?

Deployment environment

Item Value
Framework React Router v7 Framework Mode
Vercel adapter @vercel/react-router
Runtime Vercel Serverless Functions
Node platform linux-x64
Package manager Bun
Working Sharp version 0.34.5
Failing Sharp version 0.35.0

Dependency configurations

Working:

{
  "dependencies": {
    "sharp": "0.34.5"
  }
}

Failing:

{
  "dependencies": {
    "sharp": "^0.35.0"
  }
}

Minimal usage example

let sharpPromise: Promise<typeof import("sharp")> | null = null;

async function getSharp() {
  if (!sharpPromise) {
    sharpPromise = import("sharp").then((mod) => mod.default ?? mod);
  }

  return sharpPromise;
}

export async function processImage(input: Buffer) {
  const sharp = await getSharp();

  const metadata = await sharp(input, {
    failOn: "warning",
    limitInputPixels: 40_000_000,
  }).metadata();

  const output = await sharp(input, {
    failOn: "warning",
    limitInputPixels: 40_000_000,
  })
    .rotate()
    .resize({
      width: 1200,
      height: 800,
      fit: "inside",
      withoutEnlargement: true,
    })
    .webp({ quality: 82 })
    .toBuffer();

  return {
    metadata,
    output,
  };
}

Steps to reproduce

  1. Create a React Router v7 Framework Mode application.
  2. Configure it for deployment using @vercel/react-router.
  3. Use Bun as the package manager.
  4. Install sharp@0.35.0.
  5. Import and invoke Sharp from server-side application code.
  6. Deploy the application to Vercel.
  7. Trigger the serverless function that imports or uses Sharp.

Expected behavior

Sharp loads successfully in the deployed linux-x64 serverless runtime and can process the uploaded image.

Actual behavior

The build completes successfully, but the deployed serverless function fails at runtime because the @img/sharp-libvips-linux-x64 package contents or required shared library are not available under /var/task/node_modules.

Workarounds attempted

I tried the following without success on sharp@0.35.0:

  • Adding @img/sharp-linux-x64 and @img/sharp-libvips-linux-x64 as explicit dependencies.
  • Installing the Linux x64 Sharp packages during Vercel's postinstall step.
  • Preloading @img/sharp-libvips-linux-x64/lib.
  • Copying the native Sharp packages into the React Router server build output.

The only working workaround so far is pinning Sharp to:

{
  "dependencies": {
    "sharp": "0.34.5"
  }
}

Possibly related documentation

Suspected cause

This may be related to Vercel's file tracing not detecting or including the Sharp 0.35 native/libvips package layout in the final serverless function bundle.

I am reporting this here first to confirm whether Sharp 0.35 introduced a packaging or loading change that deployment platforms need to handle differently.

Sample images

No specific image is required to reproduce the issue. The failure occurs when Sharp is imported or first used at runtime.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions