"Cannot read property 'range' of null" with import syntax
EzioW opened this issue · comments
Here's my code:
export default pages.map(name => ({
path: `/${name.toLowerCase()}`,
component: React.lazy(() => import(`views/${name}`)),
}));
and get error in vscode eslint
Request textDocument/formatting failed.
Message: Request textDocument/formatting failed with message: Cannot read property 'range' of null
Occurred while linting ...
Code: -32603
my eslint config
extends: ['airbnb'],
parser: 'babel-eslint',
parserOptions: {
ecmaVersion: 7,
ecmaFeatures: {
legacyDecorators: true,
},
allowImportExportEverywhere: true,
},
versions
"dependencies": {
"babel-eslint": "^10.0.3",
"eslint": "^6.8.0",
"eslint-config-airbnb": "^18.0.1",
"eslint-plugin-import": "^2.19.1",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.17.0",
"eslint-plugin-react-hooks": "^1.7.0"
},
I had the same issue. As a workaround, downgrade babel-eslint to 8.2.6.
I have the same problem, but it occurs when in my .eslintrc I have the rule set
{
...
...
"indent": [
"error",
"two",
{
"SwitchCase": 1
}
]
}
when I remove it, it doesn't give this problem
I am also having this issue, seems to be related to using template literals.
I can confirm that locking down to 8.2.6 works as a temporary workaround, however not an ideal solution.
I solved it this way in the package.json
{
"resolutions": {
"@babel/parser": "7.7.5"
}
}
Not sure where I got it from, but tweaking the rules in your eslint config (.eslintrc
) can also solve the issue:
"rules": {
"template-curly-spacing" : "off",
"indent" : "off"
}
Fits the @grovertb observation that indent is causing the issue. Not sure you even have to turn off template-curly-spacing
, haven't tested that.
Also experiencing this issue with 10.0.3. Reverting to 8.2.6 (as mentioned earlier) solves the problem. Turning off the template-curly-spacing and indent rules also solves the problem.
Obviously neither of these workarounds is ideal. Is there anybody available to investigate this bug?
Please search for existing issue before posting:
Workaround:
npm
: #799 (comment)yarn
: #799 (comment)
Actual bug:
just upgrade babel-eslint
to fix
yarn upgrade babel-eslint
npm update babel-eslint
Here it happened because I upgraded babel-eslint 10.0.3 → 10.1.0
I had 2 projects with the same setup. Only difference being they used different versions of the packages. After spending 3 days debugging this same issue I looked through my package.json and package-lock.json file, spotting I used @babel/core 7.8.7 (in the project I got this error) in one and 7.7.5 in the other (where I don't have the error.)
Going through all the comments here and on the other issues talking about installing @babel/parser 7.7.5 and setting it in "resolution" gave me a hint to check my package-lock.json.
@babel/core references @babel/parser: 7.8.7 in its "requires" prop in package-lock.
By downgrading to @babel/core 7.7.5 again resolved it for me; because this version has @babel/parser 7.7.5 in its "requires" prop.
If you have installed @babel/parser 7.7.5 in your project and set "resolution" and it still doesn't work, try downgrading like I did.
Triggers the error:
const {
id = uniqueId(`${CSS_CLASS}_i`),
...otherAttributes
} = props
Using a pre-class, eslint does not complains anymore:
const NO_ESLINT_COMPLAIN = `${CSS_CLASS}_i`
const {
id = uniqueId(NO_ESLINT_COMPLAIN),
...otherAttributes
} = props
Same issue and downgrade babel-eslint to 8.2.6 replace of the newest(^10.0.2)
Upgrade to babel-eslint: ^11.0.0-beta.2
That fixes the issue now.
Upgrade to
babel-eslint: ^11.0.0-beta.2
That fixes the issue now.
Greetings @vramana, i delete node_modules
folder, package-lock.json
and yarn.lock
files, run npm cache clean -f
, and update to version babel-eslint: ^ 11.0.0-beta.2
but it is not working it keeps giving error Cannot read property 'range' of null
Thank you for the PR. Now that @babel/eslint-parser
has been released, we are making this repository read-only. If this is a change you would still like to advocate for, please reopen this in the babel/babel monorepo.