VS Code cannot use `tsconfig.eslint.json`

[Anders2303]

When type validation runs via npm run typecheck (for example in the github actions pipeline) we're pointing it to tsconfig.eslint.json. However, VS Code will only run Typescript using tsconfig.json, and there is no way (at least from what I could find out) to configure it to use tsconfig.eslint.json instead. This means that the includes/excludes are different, causing unexpected validation errors when you set up a PR.

Most notably, all story files get ignored by VS Code, but this is then overwritten when using tsconfig.eslint.json,

// tsconfig.json
    "exclude": [
        "__mocks__",
        "cypress",
        "coverage",
        "**/*.test.ts",
        "**/*.test.tsx",
        "**/test/*.ts",
        "**/test/*.tsx",
        "**/*.stories.tsx"
    ],

// tsconfig.eslint.json
   "exclude": [
        "coverage",
        "dist",
        "docs",
        "example-data",
        "node_modules",
        "./package-lock.json"
    ]

Is there any particular reason the configs have been set up like this? Do we actually need tsconfig.eslint.json, or can we just merge it into the base config?

[w1nklr]

Yes, there is a reason to use 2 different files for eslint and compilation.

In the compilation file (ie. tsconfig.json), we want to exclude everything that should not be shipped. Typically test files, possibly storybook or helper scripts...
In the eslint file (ie. tsconfig.eslint.json), we want to apply eslint also on the dev files (ie. the ones who are skipped by the compilation).

I already saw that linting was not done properly in VS Code.
I took some time to have a look, but could not find a solution :/

[Anders2303]

Can we not just flip the logic around, so that we use tsconfig.json in dev, and then point to some other tsconfig.prod.json when we build?

[Anders2303]

Not familiar with the release flow, but I assume we can specify config path when that happens?