remix: Remix updates tsconfig and doesn't care about extends key

What version of Remix are you using?

1.9.0

Steps to Reproduce

1. Create tsconfig-base.json to extends

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Default",
  "compilerOptions": {
    "target": "ES2019",
    "composite": false,
    "declaration": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "inlineSources": false,
    "isolatedModules": true,
    "moduleResolution": "node",
    "noUnusedLocals": false,
    "noUnusedParameters": false,
    "noImplicitAny": false,
    "preserveWatchOutput": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "resolveJsonModule": true
  }
}

1. Create tsconfig-react.json

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "React Application",
  "extends": "./tsconfig-base.json",
  "compilerOptions": {
    "jsx": "react-jsx",
    "lib": ["DOM", "DOM.Iterable", "ES2019"],
    "module": "ESNext"
  },
  "include": ["src"]
}

1. Create tsconfig-remix.json

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Remix Application",
  "extends": "./tsconfig-react.json",
  "compilerOptions": {
    "allowJs": true,
    "resolveJsonModule": true
  }
}

1. Update tsconfig.json

{
  "extends": "./tsconfig-remix.json",
  "include": ["remix.env.d.ts", "**/*.ts", "**/*.tsx"],
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@app/*": ["./app/*"]
    }
  }
}

1. Run npm run dev And you’ll see: The following suggested values were added to your “tsconfig.json”. These values can be changed to fit your project’s needs:

    - compilerOptions.forceConsistentCasingInFileNames was set to 'true'
    - compilerOptions.lib was set to 'DOM,DOM.Iterable,ES2019'
    - compilerOptions.strict was set to 'true'
    - compilerOptions.target was set to 'ES2019'
   

The following mandatory changes were made to your tsconfig.json:

    - compilerOptions.esModuleInterop was set to 'true'
    - compilerOptions.isolatedModules was set to 'true'
    - compilerOptions.jsx was set to 'react-jsx'
    - compilerOptions.noEmit was set to 'true'
    - compilerOptions.moduleResolution was set to 'node'

And tsconfig.json will be updated. So Remix doesn’t care about extends and update config to

{
  "extends": "@packages/ts-configs/remix",
  "include": ["remix.env.d.ts", "**/*.ts", "**/*.tsx"],
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@app/*": ["./app/*"]
    },
    // everything that above added by remix after npm run dev
    "allowJs": true,
    "forceConsistentCasingInFileNames": true,
    "lib": ["DOM", "DOM.Iterable", "ES2019"],
    "strict": true,
    "target": "ES2019",
    "esModuleInterop": true,
    "isolatedModules": true,
    "jsx": "react-jsx",
    "noEmit": true,
    "resolveJsonModule": true,
    "moduleResolution": "node"
  }
}

As you see this props already exists in extended config, but why remix updates it?

If I run tsc --showConfig before npm run dev and config will be updated, I got this:

> tsc --showConfig

{
    "compilerOptions": {
        "target": "es2019",
        "composite": false,
        "declaration": true,
        "declarationMap": true,
        "esModuleInterop": true,
        "forceConsistentCasingInFileNames": true,
        "inlineSources": false,
        "isolatedModules": true,
        "moduleResolution": "node",
        "noUnusedLocals": false,
        "noUnusedParameters": false,
        "noImplicitAny": false,
        "preserveWatchOutput": true,
        "skipLibCheck": true,
        "strict": true,
        "noEmit": true,
        "resolveJsonModule": true,
        "jsx": "react-jsx",
        "lib": [
            "dom",
            "dom.iterable",
            "es2019"
        ],
        "module": "esnext",
        "allowJs": true,
        "baseUrl": "./",
        "paths": {
            "@app/*": [
                "./app/*"
            ]
        }
    },
    "files": [
        "./remix.env.d.ts",
        "./app/entry.client.tsx",
        "./app/entry.server.tsx",
        "./app/root.tsx",
        "./app/routes/index.tsx"
    ],
    "include": [
        "remix.env.d.ts",
        "**/*.ts",
        "**/*.tsx"
    ]
}

As you see, ts tracks extended configs and merged it.

Expected Behavior

Remix will track extends from tsconfig.json and will not update it

Actual Behavior

Remix doesn’t care about tsconfig extends props.

If I log console.log(fullConfig); from node_modules/@remix-run/dev/dist/compiler/utils/tsconfig/write-config-defaults.js It returns

{
  extends: '@packages/ts-configs/remix',
  include: [ 'remix.env.d.ts', '**/*.ts', '**/*.tsx' ],
  compilerOptions: {
    baseUrl: '.',
    paths: { '@app/*': [Array] },
    allowJs: true,
    resolveJsonModule: true
  }
}