Can't access environment variable in app files- returns undefined

[alessiogmonti]

Describe the bug

I have created a .env file in the root directory with the variable "VITE_ETHERS" :

VITE_ETHERS = {
    targetChainId: 'id',
    targetChainName: 'chainname',
  }

these are the entire content of the file.

console.log( import.meta.env.VITE_ETHERS.targetChainName) returns undefined.

I am not trying to access this variable outside my app source code, so I don't think I need to use loadEnv() in vite.config.js

Reproduction

https://stackblitz.com/edit/vitejs-vite-fqjcrb?file=main.js

System Info

System:
    OS: macOS 11.6.8
    CPU: (4) x64 Intel(R) Core(TM) i5-4278U CPU @ 2.60GHz
    Memory: 32.04 MB / 8.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 18.2.0 - ~/.nvm/versions/node/v18.2.0/bin/node
    Yarn: 1.22.18 - /usr/local/bin/yarn
    npm: 8.9.0 - ~/.nvm/versions/node/v18.2.0/bin/npm
  Browsers:
    Brave Browser: 105.1.43.93
    Chrome: 105.0.5195.125
    Safari: 14.1.2
  npmPackages:
    @vitejs/plugin-react: ^2.1.0 => 2.1.0 
    vite: ^3.1.0 => 3.1.3

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[sapphi-red]

VIte's .env does not support multiline values (#10149).
So import.meta.env.VITE_ETHERS has {. Also even if it is supported env variables are string and JSON.parse will be needed.