tsdx: missing dependency `eslint-config-react-app`?

Current Behavior

after updating in our monorepo we found that tsdx failed on:

tsdx lint src 

(node:82469) UnhandledPromiseRejectionWarning: Error: Failed to load config "react-app" to extend from.
Referenced from: BaseConfig
    at configMissingError (/XXXXX/node_modules/eslint/lib/cli-engine/config-array-factory.js:233:9)
    at ConfigArrayFactory._loadExtendedShareableConfig (//XXXXX/node_modules/eslint/lib/cli-engine/config-array-factory.js:712:23)
    at ConfigArrayFactory._loadExtends (/XXXXX/node_modules/eslint/lib/cli-engine/config-array-factory.js:617:25)
    at ConfigArrayFactory._normalizeObjectConfigDataBody (/XXXXX/node_modules/eslint/lib/cli-engine/config-array-factory.js:547:25)
    at _normalizeObjectConfigDataBody.next (<anonymous>)
    at ConfigArrayFactory._normalizeObjectConfigData (/XXXXX/node_modules/eslint/lib/cli-engine/config-array-factory.js:491:20)
    at _normalizeObjectConfigData.next (<anonymous>)
    at createConfigArray (/XXXXX/node_modules/eslint/lib/cli-engine/config-array-factory.js:307:25)
    at ConfigArrayFactory.create (/XXXXX/node_modules/eslint/lib/cli-engine/config-array-factory.js:362:16)
    at createBaseConfigArray (/XXXXX/node_modules/eslint/lib/cli-engine/cascading-config-array-factory.js:84:48)
(node:82469) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:82469) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
✨  Done in 0.94s.

After digging though both tsdx and eslint to figure out what went wrong i found that if i add eslint-config-react-app to the project it worked npm install --save-dev eslint-config-react-app

now the project is a NONE react project and a really small helper project. It seems to me that tsdx is missing its sub requirement for linting.

Software Version(s)
TSDX 0.12.1
TypeScript 3.4.5
Browser NA
npm/Yarn Yarn 1.21.1
Node 10.17.0
Operating System MacOS

About this issue

  • Original URL
  • State: open
  • Created 4 years ago
  • Reactions: 17
  • Comments: 21 (4 by maintainers)

Commits related to this issue

Most upvoted comments

I added this particular version eslint-plugin-prettier and the problem seems to be fixed “eslint-plugin-prettier”: “3.4.1”

Hi yes, this just started failing after a recent rm -rf node_modules and npm install. Something happened.

npm install --save-dev eslint-config-react-app did not fix my problem.

A workaround that I am using for now is to use Yarn resolutions in package.json as such to force tsdx to also resolve eslint to 7.17.0:

{
  "devDependencies": {
    "eslint": "7.17.0"
  },
  "resolutions": {
    "eslint": "7.17.0"
  }
}

Edit: This should also work with npm Overrides.

I faced similar problem. I have fix the error after installing follow packages

@typescript-eslint/eslint-plugin
@typescript-eslint/parser
eslint
eslint-config-prettier
eslint-config-react-app
eslint-plugin-flowtype
eslint-plugin-import
eslint-plugin-jsx-a11y
eslint-plugin-prettier
eslint-plugin-react
eslint-plugin-react-hooks
(node:44162) UnhandledPromiseRejectionWarning: Error: Failed to load plugin 'prettier' declared in 'BaseConfig': Cannot find module 'eslint-plugin-prettier'
Require stack:
- /Users/kyleholmberg/Code/@innocuous/components/__placeholder__.js
Referenced from: BaseConfig

is this the same problem?

I think we can avoid this issue with creating a TSDX preset, as mentioned in #634

Yeah this issue also bit me just now.

The problem occurs because as soon as a different eslint is installed (eg. the current version, 7.17.0), the other version inside tsdx is reorganized inside of <project dir>/node_modules/tsdx/node_modules. This version of ESLint cannot resolve the configs, plugins, etc. because of ESLint’s unique resolution algorithm.

I guess if tsdx wants to keep the dependency on eslint, it could instead running the version at <project dir>/node_modules/eslint - which would either run the version from tsdx or the user’s version.

What do you think @sw-yx ?

$ yarn lint
yarn run v1.22.10
warning ../package.json: No license field
$ tsdx lint
Defaulting to "tsdx lint src test"
You can override this in the package.json scripts, like "lint": "tsdx lint src otherDir"
/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/config-array-factory.js:265
        new Error(`Failed to load config "${configName}" to extend from.`),
        ^

Error: Failed to load config "prettier/@typescript-eslint" to extend from.
Referenced from: BaseConfig
    at configMissingError (/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/config-array-factory.js:265:9)
    at ConfigArrayFactory._loadExtendedShareableConfig (/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/config-array-factory.js:826:23)
    at ConfigArrayFactory._loadExtends (/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/config-array-factory.js:731:25)
    at ConfigArrayFactory._normalizeObjectConfigDataBody (/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/config-array-factory.js:660:25)
    at _normalizeObjectConfigDataBody.next (<anonymous>)
    at ConfigArrayFactory._normalizeObjectConfigData (/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/config-array-factory.js:596:20)
    at _normalizeObjectConfigData.next (<anonymous>)
    at createConfigArray (/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/config-array-factory.js:340:25)
    at ConfigArrayFactory.create (/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/config-array-factory.js:395:16)
    at createBaseConfigArray (/Users/k/projects/upleveled/node_modules/tsdx/node_modules/eslint/lib/cli-engine/cascading-config-array-factory.js:86:48) {
  messageTemplate: 'extend-config-missing',
  messageData: { configName: 'prettier/@typescript-eslint', importerName: '' }
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

If you are using a monorepo with yarn workspace, try applying nohoist on tsdx

  "workspaces": {
    "packages": [ ...],
    "nohoist": [
      "**/tsdx",
      "**/tsdx/**"
    ]
  },

see https://classic.yarnpkg.com/blog/2018/02/15/nohoist/