I am getting following error in VS Code: I have these two plugin installed in .eslintrc.js And this in rules: What should be done in order to avoid this issue? Answer This slot actually refers to webcomponent slots; https://github.com/ionic-team/ionic-framework/issues/22236 The slots Ionic Framework uses are not the same as Vue 2 slots. The slots we use are Web Component slots
Tag: eslint
Disallow implicit accessing of window properties
I’m looking for an ESLint rule that disallows usage like location and only allows window.location. I’ve combed through the rules, but didn’t find one, does anyone know? Answer The no-restricted-globals rule will help you with this. Add this to your .eslintrc file So in the above example eslint won’t throw an error if you use window.location or window.history. You can
Destructuring a function call
Assuming the following code: EsLint gives out the following error: While the current code is clear and concise, if I still wanted to destructure the code and make EsLint happy, how could I do it ? Answer The docs for this rule say that properties of props should be destructured before using them, so just do that:
With eslint-webpack-plugin@2.4.1, how do you use eslint’s cache?
After switching from eslint-loader, our initial watch builds have slowed down substantially due to the lack of caching. Is there a way to use eslint’s cache? Answer ESLint’s node api has cache and cacheLocation keys in it, and setting those like enables caching like eslint-webpack-loader’s old caching behavior.
React functional component props sort alphabetically. (At the definition side)
I know an eslint rule, to sort the component props at the usage side. Like <Cmp alpha={true} beta={true} /> (rule) But is there a rule, what sorts the props from the definition side? Like: const Cmp = ({ beta, alpha = false }) => null; should be const Cmp = ({ alpha = false, beta }) => null; Answer No
How to Extend Eslint to work with create-react-app
I’m working on a React application and I would like to have a linter set up so that I can see all the warning/errors in the console. The docs doesn’t say much: https://create-react-app.dev/docs/setting-up-your-editor/ I have added EXTEND_ESLINT=true in my .env.dev file and I have created a .eslintrc.json file as well, with the following content (taken from the docs): Every rule
Why eslint throw that error, and how can I get rid of it?
I wrote a function to return sessionStorage data and eslint throw error correlated with the return statement in an arrow function Expected to return a value at the end of arrow function consistent-return Answer This is pretty simple, ESLint is telling you that the functions might exit without returning, in your case that might happen when data is false, so
disable linting inside comments
I want eslint to stop linting inside comments // and /* */. when in comments I want to have freedom to write as I please. (disable 80 char limitation etc..) that’s pretty basic in my opinion and yet I can’t find it anywhere, is there a predefined rule to do that? Thanks Answer Sure, to disable line length checking inside
How is ESLint integrated into Create React App?
When I run npx create-react-app …, a bare-bone React project is being created for me. When I then peek into package.json, there seems to be some evidence of ESLint to be present, as there is this: However, whenever I install ESLint as a dev dependency and configure it — as I usually do –, VS Code seems to pick it
Definition for rule ‘react-hooks/exhaustive-deps’ was not found
I am getting the following eslint error after adding // eslint-disable-next-line react-hooks/exhaustive-deps in my code. 8:14 error Definition for rule ‘react-hooks/exhaustive-deps’ was not found I referred to this post to fix this but the solution mentioned doesn’t work in my case. Any clue how to suppress this eslint error? PS I’m using standardjs in conjuction. Answer Not a perfect solution