environment variable substitution error

[sharh]

Describe the bug

.env file：

VITE_BUILD_ENV=production

config.ts

const config = {
  development: {
  //...
  },
 test: {
  //...
  },
 production: {
 //...
 }
}
const ENV = import.meta.env.VITE_BUILD_ENV || "production"
console.log("import.meta.env.VITE_BUILD_ENV", ENV)
export default config[import.meta.env.VITE_BUILD_ENV] ;

when run vue-tsc --noEmit && vite build --mode production，the result is：

It is worked very good when use vite --host in develop mode;

when I look up then build asset, it is like this:

console.log(""production"", ENV)

However in webpack, use webpack.DefinePlugin :

new webpack.DefinePlugin({
  'process.env.VITE_BUILD_ENV': JSON.stringify("production")
});

The result is:

console.log('process.env.VITE_BUILD_ENV ', "production")

Reproduction

https://stackblitz.com/edit/vitejs-vite-yvjegt?file=dist/assets/index.60209a92.js

Steps to reproduce

Run npm install

Run npm run build

System Info

System:
    OS: Windows 10 10.0.19041
    CPU: (4) x64 Intel(R) Core(TM) i5-4570 CPU @ 3.20GHz
    Memory: 3.79 GB / 15.95 GB
  Binaries:
    Node: 14.20.0 - D:\Program Files\nodejs\node.EXE
    Yarn: 1.22.10 - D:\Nodejs\npm_global\yarn.CMD
    npm: 7.24.0 - D:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (106.0.1370.42)
    Internet Explorer: 11.0.19041.1202

Used Package Manager

npm

Logs

Click to expand!

Unexpected token (Note that you need plugins to import files that are not JavaScript)
file: E:/project-dir/src/config/index.ts:46:42
44: };
45: const ENV = import.meta.env.VITE_BUILD_ENV || "production"
46: console.log("import.meta.env.VITE_BUILD_ENV", ENV)
                                              ^
47: export default config[ENV as "production" || "production"];
error during build:
Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)
    at error (file:///E:/project-dir/node_modules/rollup/dist/es/shared/rollup.js:1858:30)
    at Module.error (file:///E:/project-dir/node_modules/rollup/dist/es/shared/rollup.js:12429:16)
    at Module.tryParse (file:///E:/project-dir/node_modules/rollup/dist/es/shared/rollup.js:12806:25)       
    at Module.setSource (file:///E:/project-dir/node_modules/rollup/dist/es/shared/rollup.js:12711:24)      
    at ModuleLoader.addModuleSource (file:///E:/project-dir/node_modules/rollup/dist/es/shared/rollup.js:22153:20)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)

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]

Duplicate of #3304