无法访问 NextJS GraphQL 中的 .env 变量

问：

首先，让我告诉大家，我已经尝试了所有的堆栈溢出解决方案，但在我的情况下没有一个有效，我正在使用新版本的 NextJS（版本 14），所以我在完成所有旧问题后发布这个问题，所以不要将其标记为重复。

好的，来到主要问题，

我的问题是我在我的 NextJS 应用程序中使用 Apollo 客户端 （GraphQL），我想使用 .env（甚至 .env.development / .env.production / .env.local ，任何有效的东西）根据（NODE_ENV）环境更改 Apollo 客户端的 URI。

但是我无法做到这一点，process.env 的控制台何时只是在浏览器控制台中获取一个空对象，但我在我的 VS code 控制台中获取了所有内容，如下所示：

我的 .env 文件和 .env.local 文件：-

下面是我的 Apollo 客户端的代码

import { ApolloClient, InMemoryCache } from "@apollo/client";

const CreateApolloClient = () => {
  console.log(process.env, "PROCESS");
  return new ApolloClient({
    uri: `http://localhost:4000/graphql`,
    cache: new InMemoryCache(),
  });
};

export default CreateApolloClient;

请帮助我解决上述问题，并随时询问您想知道的任何细节。