Not Found Image in Static Plugin

[shiqocred]

What version of Elysia is running?

1.4.26

What platform is your computer?

Darwin 25.3.0 arm64 arm

What environment are you using

bun --version 1.3.10

Are you using dynamic mode?

no

What steps can reproduce the bug?

use basic Elysia

new Elysia().use(staticPlugin({ prefix: "/" })).use(cors({ origin: [adminUrl, storeUrl], credentials: true }))

and i can display the image with url but server log return some error

🦊 Elysia is running at localhost:3002
164 |         if (shouldIgnore(pathName)) throw new NotFoundError();
165 |         const cache = fileCache.get(pathName);
166 |         if (cache) return cache.clone();
167 |         try {
168 |           const fileStat = await fs.stat(pathName).catch(() => null);
169 |           if (!fileStat) throw new NotFoundError();
                                     ^
error: NOT_FOUND
 status: 404,
   code: "NOT_FOUND"

      at <anonymous> (/Users/macbookpro/Documents/project/monorepo/sci-master/node_modules/.pnpm/@elysiajs+static@1.4.7_elysia@1.4.22_@sinclair+typebox@0.34.48_exact-mirror@0.2.6_@sinc_894428d145c519d7fe4e3799772fabe9/node_modules/@elysiajs/static/dist/index.mjs:169:32)
      at async handle (file:///Users/macbookpro/Documents/project/monorepo/sci-master/node_modules/.pnpm/elysia@1.4.22_@sinclair+typebox@0.34.48_exact-mirror@0.2.6_@sinclair+typebox@0.34.48__f_22fc0dc8ac9c2b02f26b937f6751f981/node_modules/elysia/dist/bun/index.js:7:37)

and i cannot consume url in my nextjs website that return

http://localhost:3001/_next/image?url=http%3A%2F%2Flocalhost%3A3002%2Fimages%2Fcategories%2Fbyoarfnf072sg4kaadvq1mlw-1772059038043.webp&w=3840&q=75

"url" parameter is not allowed

and Can Elysia write files to the public directory in production, or is it the same as Next.js?

What is the expected behavior?

i expected that no return some error

What do you see instead?

Additional information

Have you try removing the node_modules and bun.lockb and try again yet?

yes, but no change

[MarcelOlsen]

I have not run into this issue before. To help debug this effectively, could you share a full reproduction including both the Next.js repository and the Elysia server?

In the meantime, here are a few points that might help clarify what is happening:

• Expected 404 logs: The NotFoundError you are seeing is expected behavior when using prefix: "/". Every incoming request hits the static plugin first; it throws a 404 for paths that are not actual files so Elysia can fall through to your other handlers. To reduce the noise, you might want to narrow your prefix (e.g., prefix: "/images") or use ignorePatterns.
• Next.js image configuration: The error stating the url parameter is not allowed usually stems from the next/image configuration. You likely need to allow the remote host in your next.config.js:

images: {
  remotePatterns: [
    {
      protocol: 'http',
      hostname: 'localhost',
      port: '3002'
    }
  ]
}

• File system access: Keep in mind that Elysia can write files anywhere on the disk where it has the necessary permissions. It does not have the same build-time restrictions that Next.js enforces with the public/ directory.

[shiqocred]

yups i have setup next config

import type { NextConfig } from "next";

const nextConfig: NextConfig = {
  /* config options here */
  reactCompiler: true,
  images: {
    remotePatterns: [
      {
        hostname: "localhost",
        protocol: "http",
        port: "3002",
      },
    ],
  },
};

export default nextConfig;

this the repository
https://github.com/shiqocred/monorepo-commerce

the problem in Image component
https://github.com/shiqocred/monorepo-commerce/blob/main/apps/admin/src/app/(dashboard)/categories/_components/columns.tsx

error when i optimized the image

<Image
  src={category.image}
  alt={category.name}
  fill
  sizes={"100vw"}
  className="object-cover"
/>

but when i unoptimized that work normally

<Image
  src={category.image}
  alt={category.name}
  fill
  sizes={"100vw"}
  className="object-cover"
  unoptimized={true}
/>

[shiqocred]

and i get error when infer eden in my nextjs website

The inferred type of 'dataApi' cannot be named without a reference to '../../node_modules/@elysiajs/eden/dist/types-0YqzVuGd'. This is likely not portable. A type annotation is necessary.

[MarcelOlsen]

Hey! You've stumbled upon a very niche issue actually, which is only a problem since nextjs@16. Due to security concerns, next doesn't allow setting any of these addresses in remote patterns 127.0.0.1, 192.168.x.x, ::1, etc. localhost always hits that list. You have 2 options to resolve this, depending on whether you're fine with bypassing this (not recommended for an actual production app):

1. Set dangerouslyAllowLocalIP: true in the image object

2. Use a Next.js rewrite to proxy image requests through your Next.js server instead of directly accessing Elysia. This approach allows next/image to see a local path, avoiding the private IP check.
   In apps/api/src/config.ts, return a relative path instead of an absolute URL:

export const imageUrl = `/images`;

In apps/admin/next.config.ts:

import type { NextConfig } from "next";

const nextConfig: NextConfig = {
  reactCompiler: true,
  async rewrites() {
    return [
      {
        source: "/images/:path*",
        destination: `${process.env.NEXT_PUBLIC_API_URL ?? "http://localhost:3002"}/images/:path*`,
      },
    ];
  },
  images: {},
};

export default nextConfig;

Option 2 is the better long-term solution as it decouples your image URLs from the API host. In production, you simply set NEXT_PUBLIC_API_URL, and everything works without needing to modify remote patterns.