tsconfig can't be read with some compilerOptions.baseUrl and react-scripts@4.0.1

[ValeryVS]

Describe the bug

Add "baseUrl": "src", to compilerOptions of tsconfig.

src/index.tsx
  Line 0:  Parsing error: Cannot read file '/users/tasogare/projects/sdc-repos/www/services/map-editor/client/services/remote-control-cloud/client/tsconfig.json'

Did you try recovering your dependencies?

It works without baseUrl, or with "baseUrl": "./".

Which terms did you search for in User Guide?

baseUrl

Environment

% npx create-react-app --info
npx: установлен 67 в 7.022s

Environment Info:

  current version of create-react-app: 4.0.1
  running from /Users/tasogare/.npm/_npx/69119/lib/node_modules/create-react-app

  System:
    OS: macOS 10.15.7
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
  Binaries:
    Node: 12.18.3 - ~/.nvm/versions/node/v12.18.3/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.8 - ~/.nvm/versions/node/v12.18.3/bin/npm
  Browsers:
    Chrome: Not Found
    Edge: Not Found
    Firefox: 72.0.2
    Safari: 14.0.2
  npmPackages:
    react:  16.13.1
    react-dom:  16.13.1
    react-scripts: 4.0.1 => 4.0.1
  npmGlobalPackages:
    create-react-app: Not Found

Steps to reproduce

(Write your steps here:)

1. Add "baseUrl": "src", to compilerOptions of tsconfig.
2. Run npm start

Expected behavior

baseUrl accepted and imports from src/features/map/index.tsx can be written as from 'features/map'.

Actual behavior

Project can't be built.

Reproducible demo

---

[ehsankhfr]

Not sure what kind of structure does your application have. I created a fresh app with cra 4.0.1 and absolute components import, and all looks fine with setting baseUrl as src:
https://codesandbox.io/s/sample-app-for-cra-issue-10410-0msiu

[ben8p]

Same problem here....
After upgrading react-script my project cannot build...
I use "baseUrl": ".", and the error I receive is:

src/xxx.ts
  Line 0:  Parsing error: Cannot read file '/home/xxx/yyy/packages/website/package/packages/website/package/tsconfig.json'

Where the actual file is in /home/xxx/yyy/packages/website/package/tsconfig.json

Seems like part of the path is concatenated when it should not

Edit 1:
After some research I found it's an eslint issue. Most likely around

"parserOptions": {
		"project": "./website/package/tsconfig.json"
	},

I am still trying to get it fixed properly...

Edit 2:
It seems like this is due to https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/config/webpack.config.js#L770

In previous version cwd was not set...

Edit 3:
Seems like #10170 could solve the issue (by disabling entirely eslint)...
But then we have to run it by ourselves...

[ben8p]

Maybe a regression from 3.2.0 ? #7755

[ValeryVS]

I can confirm, that disabling eslint, for example, through craco, is a workaround for this issue.

[ValeryVS]

Not sure what kind of structure does your application have.
We hava a monorepo with .eslintrc.js in root and such parserOptions

      parserOptions: {
        project: [
          // use more explic paths here, `**` globs will lead to slow lint
          './packages/*/tsconfig.json',
          './services/*/client/tsconfig.json',
          './tsconfig.json',
        ],
      },

[heyacherry]

Not work well with CRA@4.0.3