Environment variable in markup codes of SvelteKit could not work at Vercel

Hi~ I am a developer in South Korea. I am not good at english yet. But I have a question about SvelteKit.I wrote the below codes in +page.svelte as SvelteKit tutorial.This code worked well in local dev mode.

<script>  import { env } from '$env/dynamic/public';</script><main style:background={env.PUBLIC_THEME_BACKGROUND} style:color={env.PUBLIC_THEME_FOREGROUND}>  {env.PUBLIC_THEME_FOREGROUND} on {env.PUBLIC_THEME_BACKGROUND}</main>.....

Then I deployed the above codes to Vercel, build and published. But I got some error that isundefined in import { env } from '$env/dynamic/public'Other codes of the SvelteKit tutorial which was deployed to Vercel worked well except this code.That is, This error is not problem of the adapter or runtime of Vercel. Ok, I already changed them but could not fix this error.

So, I created +page.server.ts file and I moved the above codes into that like below.

import { env } from '$env/dynamic/public';export function load() {  return { env: {     PUBLIC_THEME_BACKGROUND: env.PUBLIC_THEME_BACKGROUND,    PUBLIC_THEME_FOREGROUND: env.PUBLIC_THEME_FOREGROUND,  }};}

And I changed the markup file(+page.svelte) like below.

<script>  export let data;</script><main style:background={data.env.PUBLIC_THEME_BACKGROUND} style:color={data.env.PUBLIC_THEME_FOREGROUND}>  {data.env.PUBLIC_THEME_FOREGROUND} on {data.env.PUBLIC_THEME_BACKGROUND}</main>.....

Now, This code work well. In short, Why cannot $env/dynamic/public work in markup file at Vercel?

• Changed the adapter of Vercel in svelte.config.js from edge to nodejsXXX.
• Changed the build script in package.json from vite build to mv ./env.local to ./.env && vite build and remove .env from .gitignore.
• Set up Vercel's environment variables in Project Settings.