.env Variables inside the compiled JavaScript?

Question

I have a React Webapp where i placed a .env file in the root directory and inside a file i use these env variables. Now when i did npm run build, in the compiled js file these env variables are clearly written in the js file.

Why is it like this? This should not be like this, right?

vite.config.ts

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import vue from '@vitejs/plugin-vue'
import { join } from 'path';
import { config } from 'dotenv';

config({ path: join(__dirname, '.env') });

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    react()
  ]
})

Example Usage of a env variable in my Project:

let exampleKey: string = (import.meta.env.VITE_EXAMPLE_KEY as string)

I dont know what to try