In my project, I am using Next.js with TypeScript and Cypress for E2E tests. The challenge I am facing is configuring tsc to handle multiple configs for different folders.
The tsconfig.json file in the project root for Next.js looks like this:
{
"compilerOptions": {
"allowJs": true,
"baseUrl": "./src",
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"isolatedModules": true,
"jsx": "preserve",
"lib": ["dom", "dom.iterable", "esnext"],
"module": "esnext",
"moduleResolution": "node",
"noEmit": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"strictPropertyInitialization": true,
"strictNullChecks": true,
"strict": true,
"target": "es5"
},
"exclude": ["node_modules"],
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"]
}
Cypress has its own cypress/tsconfig.json as shown below:
{
"extends": "../tsconfig.json",
"compilerOptions": {
"target": "es5",
"lib": ["es5", "dom"],
"isolatedModules": false,
"types": ["cypress", "@testing-library/cypress"],
"noEmit": true
},
"include": [
"**/*.ts"
]
}
To address this issue, I have a script called "type-check":
"type-check": "tsc --pretty --noEmit"
The problem arises when running the type check script because it uses the project root's config instead of the specific config for each folder. How can I modify the command to use the correct tsconfig.json for each folder?