I’m actually trying to access BASE_URL from env through nuxt runtimeConfig.

My nuxt version: “nuxt”: “^3.8.0”.

Here is my .env

NODE_ENV = 'development'
VITE_API_URL=http://localhost:3000

And nuxt.config.ts

    import { createResolver } from '@nuxt/kit'
    const { resolve } = createResolver(import.meta.url)
    
    export default defineNuxtConfig({

      runtimeConfig: {
           apiSecret: '123',
           public: {
             apiBase: '/api'
           },
           baseUrl: process.env.VITE_API_URL || 'http://localhost:3000'
      },

       }

At trying to access the baseUrl in a view

    <script lang="ts" setup>

    definePageMeta({ layout: 'page' })
    useHead({ title: 'login' })
    
    const runtimeConfig = useRuntimeConfig()
    
    onMounted(async () => {
    
        console.log(runtimeConfig.apiSecret)
        console.log(runtimeConfig.public.apiBase)
    
       let baseUrl = useRuntimeConfig().baseUrl;
       console.log('onMounted ', baseUrl );
    });

but running the code gives

 undefined.    //  runtimeConfig.apiSecret
 undefined.    //  runtimeConfig.public.apiBase 
 onMounted  undefined. // useRuntimeConfig().baseUrl

I didn’t find any error but why it didn’t work out