@babel/eslint-parser showing unexpected token errors when used with eslint-plugin-import and static class properties

Bug Report

  • I would like to work on a fix!

Current behavior
When running the linter with the plugins in the title, I’m seeing the following issues:

/Users/mprzybylski/Desktop/eslint-issue/examples/index.js
  1:17  error  Parse errors in imported module './Foo': Unexpected token = (5:20)  import/namespace
  1:17  error  Parse errors in imported module './Foo': Unexpected token = (5:20)  import/no-deprecated
  1:17  error  Parse errors in imported module './Foo': Unexpected token = (5:20)  import/default
  1:17  error  Parse errors in imported module './Foo': Unexpected token = (5:20)  import/no-named-as-default
  1:17  error  Parse errors in imported module './Foo': Unexpected token = (5:20)  import/no-named-as-default-member

This is the result of including static class properties in the Foo file even though the associated babel configuration supports it. If you open examples/Foo.js and comment out lines 5-7, you don’t see the errors anymore (other new errors are present as a result, but those are all valid).

I’m attaching a zip file to demonstrate the issue clearly. Please download and unzip the file, run npm i && npm run lint to see the issue.

eslint-issue.zip

Expected behavior
There should be no errors reported associated with the code.

Environment

System:
    OS: macOS 10.15.7
  Binaries:
    Node: 12.13.0 - ~/.nvm/versions/node/v12.13.0/bin/node
    npm: 6.12.0 - ~/.nvm/versions/node/v12.13.0/bin/npm
  npmPackages:
    @babel/core: 7.12.10 => 7.12.10
    @babel/eslint-parser: 7.13.4 => 7.13.4
    @babel/eslint-plugin: 7.13.0 => 7.13.0
    @babel/plugin-proposal-export-default-from: 7.12.1 => 7.12.1
    @babel/plugin-proposal-export-namespace-from: 7.12.1 => 7.12.1
    @babel/plugin-proposal-logical-assignment-operators: 7.12.1 => 7.12.1
    @babel/plugin-syntax-dynamic-import: 7.8.3 => 7.8.3
    @babel/plugin-transform-runtime: 7.12.10 => 7.12.10
    @babel/preset-env: 7.12.11 => 7.12.11
    @babel/preset-react: 7.12.10 => 7.12.10
    @babel/runtime-corejs3: 7.12.5 => 7.12.5
    babel-plugin-transform-react-remove-prop-types: 0.4.24 => 0.4.24
    eslint: 7.20.0 => 7.20.0

Possible Solution

Additional context
This only surfaced after installing eslint-plugin-import but does not actually seem to be related to the plugin itself. I was actively discussing this in benmosher/eslint-plugin-import#1995 with @ljharb but we don’t think the issue is with that plugin rather something in the parser here.

3 thoughts on “@babel/eslint-parser showing unexpected token errors when used with eslint-plugin-import and static class properties

  1. Yeah, for babel in package.json like .babelrc: it’s specific to your package and not to the whole app.

    The reason for the difference is that there are two possible use cases: sometimes you want to keep your config where it applies (.babelrc/package.json) and have multiple configs for each folder/package, sometimes you want to centralize it in a single place. (docs).

    The reason that package.json behaves like .babelrc is mostly historical: babel.config.json/babel.config.js was introduced in Babel 7, while package.json/.babelrc have been introduced long before.

  2. I’m closing this issue since it’s not caused by Babel. Starting from the next release we’ll suggest using babel.config.json files when @babel/eslint-parser cannot find the config (#12956) to avoid #12955 (comment).