I have the following imports in my file nodejs:
import config from 'config';
import { PassportStatic } from 'passport';
import rootPath from './handlers/rootPath';
import SSOCallback from './handlers/SSOCallback';
import authFailure from './handlers/authFailure';
import ensureAuthenticated from '../modules/auth/ensureAuthenticated';
import APIConnect from './handlers/apiConnect';
import express = require('express');
This is the tslint.json file I am using:
{
"parser": "#typescript-eslint/parser",
"env": {
"es6": true,
"node": true,
"jest/globals": true,
"browser": true
},
"parserOptions": {
"sourceType": "module",
"ecmaVersion": 2019,
"project": "tsconfig.json",
"ecmaFeatures": {
"jsx": true
}
},
"extends": [
"airbnb-base",
"plugin:#typescript-eslint/recommended",
"prettier/#typescript-eslint",
"plugin:prettier/recommended",
"plugin:#typescript-eslint/recommended-requiring-type-checking",
"plugin:import/errors",
"plugin:import/warnings",
"plugin:import/typescript",
"plugin:react/recommended"
],
"plugins": ["prettier", "jest"],
"rules": {
"no-console": 0,
"no-param-reassign": 0,
"prettier/prettier": "error",
"no-underscore-dangle": [
"error",
{
"allow": ["__get__", "__set__"]
}
],
"import/extensions": [
"error",
"ignorePackages",
{
"js": "never",
"jsx": "never",
"ts": "never",
"tsx": "never"
}
]
},
"settings": {
"react": {
"version": "detect"
}
}
}
when i run npm run lint command i get the following Error:
8:1 error `express` import should occur before import of `./handlers/rootPath` import/order
i tried to move line 8 before import `./handlers/rootPath, but when i save it automatically git back to line 8.
Any idea how to fix it ?
Related
my .eslintrc.json file located at ./
{
"env": {
"browser": true,
"es2021": true
},
"extends": [
"eslint:recommended",
"plugin:import/errors",
"plugin:import/warnings"
],
"overrides": [
],
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "module"
},
"rules": {
},
"settings": {
"import/resolver": {
"alias": {
"root": ["./"],
"map": [
["#", "./src"]
],
"extensions": [".js", ".jsx", ".ts", ".tsx"]
}
}
}
}
My foo.js file located in ./src. As you can see it is not suggesting any files. Why?
I am using module import from next.
Trying to import a component like so.
import Navbar from '#/components/Navbar/Navbar';
When I run npm run lint. I get the following error.
1:20 Error: Unable to resolve path to module '#/components/Navbar/Navbar'. import/no-unresolved
This is my jsconfig.json
"compilerOptions": {
"baseUrl": ".",
"paths": {
"#/*": ["./src/*"],
"#/components/*": ["components/*"],
"#/pages/*": ["pages/*"],
"#/styles/*": ["styles/*"]
}
}
}
This is eslintrc.json
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 11,
"sourceType": "module"
},
"settings": {
"react": {
"version": "detect"
},
"import/resolver": {
"alias": {
"map": [
["#components", "./components/*"],
["#images", "./public/*"],
["#/pages/*", "pages/*"],
["#/styles/*", "styles/*"]
],
"extensions": [".js", ".jsx"]
}
}
},
"plugins": ["react", "react-hooks", "jest"],
"rules": {
"react/jsx-props-no-spreading": 0,
"react/react-in-jsx-scope": "off",
"import/extensions": "off",
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
"react/display-name": 1,
"jest/no-disabled-tests": "warn",
"jest/no-focused-tests": "error",
"jest/no-identical-title": "error",
"jest/prefer-to-have-length": "warn",
"jest/valid-expect": "error",
"import/no-unresolved": [2, { "caseSensitive": false }]
}
}
I have tried many solutions from here and here here. Does not seem to work.
THIS is my problems
Eslint cannot find the file's location?
This is the error!
Thank You in advance for the help!
I was having this problem!
Eslint cannot find the file's location because the path of the file is not fully defined, we must specify them in the configuration file.
The reference exists and it works, the problem is that eslint cannot find it. I fix it as follows!
Unable to resolve the module path './Board'. note that Board does not have an extension, that's the problem! We just need to specify eslint how to resolve the extensions and voila.
I assume eslint installed and has problems integrating express node and react js projects
You can use the automatic configuration of eslint follow the steps and when it is installed configure your .eslint.json file add the description of settings
"settings": {
"import/resolver": {
"node": {
"extensions": [".js", ".jsx"],
"moduleDirectory": ["node_modules", "src/"]
}
}
}
.eslintrc.json the full file look like:
{
"env": {
"browser": true,
"es2021": true,
"node": true
},
"extends": ["plugin:import/recommended", "plugin:react/recommended", "standard"],
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 12,
"sourceType": "module"
},
"plugins": ["react"],
"rules": {
"semi": [2, "always"],
"comma-dangle": [
"error",
{
"arrays": "only-multiline",
"objects": "only-multiline",
"imports": "only-multiline",
"exports": "only-multiline",
"functions": "only-multiline"
}
],
"space-before-function-paren": 0,
"spaced-comment": [
"error",
"never",
{
"line": {
"markers": ["/"],
"exceptions": ["-", "+"]
},
"block": {
"markers": ["!", "-", "+"],
"exceptions": ["*"],
"balanced": true
}
}
]
},
"settings": {
"import/resolver": {
"node": {
"extensions": [".js", ".jsx"],
"moduleDirectory": ["node_modules", "src/"]
}
}
}
}
https://eslint.org/docs/user-guide/getting-started
I have this code with template literals inside component and I'm getting parsing error from ESLint. I tried to use #babel/eslint-parser but it doesn't help. Also with this Parsing error: Unexpected token, expected "..." I have '...' expected.ts(1005)
import React from "react";
import { Link } from "react-router-dom";
import logo from "../../images/logo_cl.png";
function Comptetition({ competition }) {
return (
<Link to {`/competitions/${competition.id}`}>
<li className="complist__item">
<img className="complist__item-image" src={logo} alt="item" />
<p className="complist__item-name">{competition.name}</p>
<p className="complist__item-country">{competition.area.name}</p>
</li>
</Link>
);
}
export default Comptetition;
my .eslintrc.json looks like this:
{
"env": {
"browser": true,
"jest": true,
"es6": true,
"node": true
},
"plugins": [
"import",
"react"
],
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"airbnb-base",
"plugin:prettier/recommended"
],
"parser": "#babel/eslint-parser",
"parserOptions": {
"ecmaVersion": 12,
"sourceType": "module",
"requireConfigFile": false,
"ecmaFeatures": {
"jsx": true,
"modules": true
},
"babelOptions": {
"presets": [
"#babel/preset-react"
]
}
},
"rules": {
"semi": "error",
"no-console": "warn",
"no-eval": "error",
"import/first": "error",
"prefer-template": 1,
"no-param-reassign": [
2,
{
"props": false
}
]
}
}
I've already read lot of info but cannot resolve this error in VScode
From the code it looks like you're looking at the correct line but the wrong place.
You're missing a "=" for value to "to" prop of the Link
<Link to={`/competitions/${competition.id}`}>
You forget to add = in to
to={`/competitions/${competition.id}`}
I've got two variables in my webpack config which are required but are throwing linting errors.
Is there a way add exceptions for a specific variable?
I want to ignore path and persistentPlugins
current .eslintrc file looks as follows:
{
"parser": "babel-eslint",
"env": {
"es6": true,
"browser": true,
"node": true
},
"globals": {
"React": false,
"react": false,
},
"plugins": [
"react"
],
"extends": [
"eslint:recommended",
"plugin:react/recommended"
],
"rules": {
"no-console": 0,
"no-underscore-dangle": 1,
"quotes": [2, "single"],
"react/no-danger": "off",
}
}
Assuming that it's the no-undef rule that's raising the error, specify them as globals:
...
"globals": {
"path": true,
"persistentPlugins": true,
"React": false,
"react": false,
},
...
Alternatively, you could disable the error inline in the webpack config:
/*global path, persistentPlugins*/
For other errors, there is a question here on disabling them inline.