正如在next.js文档中提到的，运行时环境变量可以用于动态呈现的页面。
下面的示例中使用的测试设置是一个带有app router的Next.js 14项目。
给定下面的页面，环境变量实际上被它的运行时值（在docker-compose.yml文件中定义）替换：

import { unstable_noStore as noStore } from 'next/cache'
import styles from './page.module.css'

export default function Home() {
  // function called to opt into dynamic rendering
  noStore();
  const value = process.env.SOME_ENV_VARIABLE;

  return (
    <main>
      { value }
    </main>
  )
}

字符串
但是，在页面顶部添加'use client'指令后，docker-compose文件中定义的环境变量值只会短暂出现，然后被undefined替换。
(the在这个例子中，'use client'指令不是必需的，但在我想使用运行时环境变量的项目中，也使用了useState）
这就是它反复刷新页面的样子，它简要地显示'this-is-a-test-env-value'（docker-compose文件中定义的值），然后替换为undefined x1c 0d1x
有没有一种方法可以在动态呈现的页面上成功地将'use client'指令和运行时环境变量合并结合起来？