Values get separated from object when importing JSON.

[bitfexl]

Describe the bug

When importing JSON like this:

import json from "./data.json";
document.querySelector("#app").innerHTML = JSON.stringify(json);

{
    "a": "valueA",
    "bcd_EFG": "valueB",
    "x y z": "valueXYZ"
}

the output of vite build --minify false is:

const a = "valueA";
const bcd_EFG = "valueB";
const json = {
  a,
  bcd_EFG,
  "x y z": "valueXYZ"
};
document.querySelector("#app").innerHTML = JSON.stringify(json);

With minification terser is able to inline the variables again, esbuild is not.

However if the JSON "object" is an array the output of vite build --minify false is:

const json = [
  {
    a: "valueA",
    bcd_EFG: "valueB",
    "x y z": "valueXYZ"
  }
];
document.querySelector("#app").innerHTML = JSON.stringify(json);

Why does Vite import a JSON object so weirdly in the first case? Is this a bug?

Reproduction

https://stackblitz.com/edit/vitejs-vite-cqp5np6f?file=src%2Fmain.js

Steps to reproduce

see above examples

System Info

vite/7.0.0 also happens on version 5

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.

[bitfexl]

never mind, found it https://github.com/vitejs/vite/blob/main/packages/vite/src/node/plugins/json.ts