tsconfig.json gets reset after yarn start React app

Question

I created my React app with create-react-app app_name --typescript. Since Typescript doesn't support NODE_PATH. I'm trying to use baseUrl in tsconfig.json.

However, every time running yarn start after putting "baseUrl": "src" in "compilerOptions", the baseUrl gets gone. I feel like yarn start resets tsconfig.json.

How can I stop it to reset the file?

**tsconfig.json**
{
  "compilerOptions": {
    "target": "es6",
    "allowJs": true,
    "skipLibCheck": false,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve"
  },
  "include": ["src"]
}

Answer 1

There's a workaround.

1. Create a new file, say "base-tsconfig.json" and put the baseUrl config and paths in there. Those won't be overwritten by CRA.

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}

2. Extend the main tsconfig.json file with your custom configuration

{
  "extends": "./base-tsconfig.json"
}

More info here.

Answer 2

create-react-app currently removes the baseUrl property, I don't think paths are currently supported by them unfortunately :(

Read more here https://github.com/facebook/create-react-app/issues/5585