Develop Reference

Definition for rule '#typescript-eslint/no-implicit-any' was not found with Storybook js

I am getting this error when I make changes to the generated code from running Storybook.js. These are the instructions I am following
https://gist.github.com/shilman/bc9cbedb2a7efb5ec6710337cbd20c0c
But because I am adding StorybookJS to an existing project, the only commands I've ran are:
$ npx -p #storybook/cli#next sb init --story-format=csf-ts
$ yarn add #storybook/addon-docs#next --dev
Running yarn storybook produces this error.
ERROR in ./src/stories/0-Welcome.stories.tsx
Module Error (from ./node_modules/eslint-loader/dist/cjs.js):
Line 5:1: Definition for rule '#typescript-eslint/no-implicit-any' was not found #typescript-eslint/no-implicit-any
Line 24:1: Definition for rule '#typescript-eslint/no-implicit-any' was not found #typescript-eslint/no-implicit-any
The storybook server runs fine but as soon as I make changes to some text and Storybook tries to reload the changes, I get the error seen above.
There is a lot of magic that happens behind the scenes of create-react-app so I am unaware of how to pinpoint and fix this error. My guess is that a eslint typescript rule is missing so upon Storybook reloading any type of change, the missing rule error occurs

It sounds like you're missing the .eslintrc.json file which describes the rules. You can read more about the file format and options here: https://eslint.org/docs/user-guide/configuring
Example:
{
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"rules": {
"semi": "error"
}
}
If the error still occurs, try configuring the no-implicit-any rule.

"to" is not a valid property of expect jest/valid-expect

I'm trying to fix eslint warnings in my code and I get a lot of these. The problem is that the files in question are not jest tests but cypress tests. The tests are valid because cypress expect is not the same as jest expect.
Is there a way to either ignore the cypress directory for jest/valid-expect warnings ? or if that fails just ignore the directory for any jest validation ? There's no jest tests in that directory.

This answer provides most of the information needed (thanks CRayen for pointing me to another question (which was a duplicate of another)).
Basically you can put a .eslintrc file into any subfolder in which you want to override rules. Then you need to add a section like the one in the answer:
"overrides": [{
"files": [ "*.spec.js" ],
"rules": {
"no-unused-expressions": 0
}
}]
where you explicitly turn off the rules you don't want to be used to check the files listed by setting them to 0.

Add to the first line in the file:
/* eslint-disable jest/valid-expect */

Eslint Error while working with Trails js

I am using Eslint to lint the code of my Trails.js project before testing it. Tails.js comes with existing pre-configurations eslint-config-trails. However, when I am testing my code eslint throws a Definition for rule 'no-global-assign' was not found error, for every .js file in my codebase.
Manually adding the rule:
"rules": {
"no-global-assign": ["error", {"exceptions": ["Object"]}]
}
Doesn't fix the error. Setting the rule to "warn" makes me at least run the tests, but outputs a warning for every .js file.

The no-global-assign rule was added in ESLint 3.3.0.
You need to use that version or later, if you want to use that rule.

Prevent "test/expect/etc is not defined" errors when using Jest

Facebook's Jest testing framework is easy to get started with, but the documentation overlooks an annoying aspect: test statements will be highlighted as errors by any editor that tries to warn of undefined symbols, because test, expect, and all matcher methods are not defined.
Similary, attempting to run a test file with node directly will fail with ReferenceError: test is not defined.
What require/import statement(s) need to be added for those errors to go away?

Node
If you want to run them directly through node, try to require jest and/or jest-runtime. Also give #types/jest a try as well.
Check Edit 2 for new info about this
Edit
#types/jest (jest-DefinitelyTyped) is definitely needed (or just one solution). If you install it (e.g., dev dependency), the IDE errors should go away.
I just tried it on Webstorm, and it works.
Edit 2
The new Jest#20 Matchers (e.g., .resolves and .rejects) are still not defined in #types/jest. You can keep track of its status on the links below:
https://github.com/DefinitelyTyped/DefinitelyTyped/pull/16645
https://github.com/DefinitelyTyped/DefinitelyTyped/issues/16803
It should be available soon, though!
Also, it doesn't seem possible to run it directly through node. Last night I tried a bunch of different things, but using jest is the way to go - it really uses node under the hood, so I thought it would be possible as well. #thymikee over your opened issue at GitHub made clear that it's not.
Edit 3
The new release (20.0.1) includes the newest Jest definitions.
Lint
this isn't in the scope of this specific problem, but it also helps
Are you using something like ESLint? If so, you'll need eslint-plugin-jest
Following the steps described in this page: https://www.npmjs.com/package/eslint-plugin-jest, you will basically need to add it as an ESLint plugin and set jest globals in the ESLint configuration:
{
"env": {
"jest/globals": true
}
}
If you plan on supporting ES6 tests, you'll also need Babel and babel-jest plugin with the following jest configuration:
"transform": {
"^.+\\.js$": "babel-jest"
}
Finally, for Typescript tests you'd need the #types/jest and ts-jest packages as well

Adding following .eslintrc configuration is enough
{"env":
{
"jest": true
}
}

I'm using VSCode and ESLint, you need to install eslint-plugin-jest
Add jest info to your .eslintrc.js
{
"plugins": ["jest"]
},
"env": {
"jest/globals": true
}

Turn off ESLint rule (in React app, using WebStorm)

I am writing a React app in WebStorm using the standard React setup. I have never previously explicitly set up any linting, so whatever error/warning messages are showing up are from some sort of default configuration. When I run npm start I get the following warning:
Compiled with warnings.
Warning in ./path/to/MyComponent.js
/my/complete/path/to/MyComponent.js
19:49 warning Unexpected whitespace before property bind no-whitespace-before-property
...
You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.
The last two lines make it explicitly clear that the warnings are from ESLint (as opposed to, say, JSHint or some custom React linting, etc.).
I want to keep ESLint running, i.e. I don't just want to globally disable all linting. However, I want to turn the "no-whitespace-before-property" warning off everywhere, not just on one line or in one file. How do I do that?
My package.json shows the following for npm start (which is what I run when the warnings appear):
"scripts": {
"start": "react-scripts start",
...
}
I am developing in WebStorm. The ESLint preferences panel has the "Enable" checkbox unchecked, so all of the ESLint configuration options in the IDE are grayed-out and presumably irrelevant, so presumably also the configuration and invocation of ESLint are happening elsewhere (e.g. built into React?).
I tried putting the following .eslintrc.json file into my project home directory:
{
"rules": {
"no-whitespace-before-property": "off"
}
}
alone as well as with "extends": "eslint:recommended".
I tried adding the following to my project's package.json file:
{
...
"eslintConfig": {
"rules": {
"no-whitespace-before-property": "off"
}
}
}
I've also tried setting the value to 0 instead of to "off".
It may or may not be relevant that I'm writing a React app, and it may or may not be relevant that I'm developing in WebStorm, but I include those facts just in case.
I've checked around on StackOverflow and can't find an answer.

The note below the errors is not coming from ESLint (error is). So I'm assuming you are using some sort of wrapper, like github.com/facebookincubator/create-react-app Those wrappers do not use .eslintrc file and can't be configured directly. You will have to read through documentation of your wrapper to figure out how to disable this rule.
In general ESLint wrappers like create-react-app, standard, xo, etc. are specifically designed to "just work", and hence remove ability to configure and fine tune styles/rules.