tsconfig generated by create-vite includes comments

[fernandoacorreia]

Describe the bug

When running npm create vite, it creates files with .json extension which are not valid JSON files. These files will be rejected by pre-commit checkers and won't work with standard JSON tools. They will be flagged as invalid JSON on GitHub: https://github.com/fernandoacorreia/vite-invalid-json-repro/blob/main/tsconfig.app.json

Suggestion: create tsconfig.app.jsonc and tsconfig.node.jsonc with a jsonc extension and include them in tsconfig.json:

{
  "files": [],
  "references": [
    { "path": "./tsconfig.app.jsonc" },
    { "path": "./tsconfig.node.jsonc" }
  ]
}

Reproduction

https://github.com/fernandoacorreia/vite-invalid-json-repro

Steps to reproduce

❯ npm create vite@latest -- -t react-swc-ts test

❯ jq < test/tsconfig.app.json
jq: parse error: Invalid numeric literal at line 10, column 7

❯ jq < test/tsconfig.node.json
jq: parse error: Invalid numeric literal at line 9, column 7

System Info

System:
    OS: macOS 15.3.2
    CPU: (8) arm64 Apple M1
    Memory: 112.89 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 23.10.0 - ~/.local/state/fnm_multishells/33599_1742751260877/bin/node
    Yarn: 1.22.22 - /opt/homebrew/bin/yarn
    npm: 10.9.2 - ~/.local/state/fnm_multishells/33599_1742751260877/bin/npm
  Browsers:
    Chrome: 134.0.6998.118
    Safari: 18.3.1

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]

Your suggestion does not work because tsconfig.json in lit-ts template has comments. Renaming tsconfig.json to tsconfig.jsonc will break the build command as tsc would now need to be tsc -p tsconfig.jsonc (microsoft/TypeScript#43121).

Probably removing the comments would work, but I'm not sure if we should do that, given that you can do it yourself.

[ArnaudBarre]

That's something known that tsconfig contains comments. Prettier support it by default without extensions change. Most project have one tsconfig.json with comments and it doesn't causes issues.

Being compatible with tools added later that are multi languages and don't have this known TS thing encoded is out of scope IMO