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

[reintroducing]

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 import-js/eslint-plugin-import#1995 with @ljharb but we don't think the issue is with that plugin rather something in the parser here.

[babel-bot]

Hey @reintroducing! We really appreciate you taking the time to report an issue. The collaborators on this project attempt to help as many people as possible, but we're a limited number of volunteers, so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack community that typically always has someone willing to help. You can sign-up here for an invite."

[JLHwung]

The error is thrown from Acorn. According to https://github.com/benmosher/eslint-plugin-import#importparsers, you need to tell eslint-plugin-import to use @babel/eslint-parser.

I think it is a bug of eslint-plugin-import, they should have respected the root parser settings.

{
  settings: {
    "import/parsers": {
      "@babel/eslint-parser": [".js"],
    },
  }
}

[ljharb]

ahhh, thanks for clarifying.

are the root parser settings made available to rules?

[reintroducing]

@JLHwung changing the parser does fix the test code i provided, however in the larger application that this resides in, the usage of moment errors now across the board with the following:

4:20  error  Parse errors in imported module 'moment': No Babel config file detected for /Users/mprzybylski/Work/fe-ui/node_modules/moment/dist/moment.js. Either disable config file checking with requireConfigFile: false, or configure Babel so that it can find the config files. (undefined:undefined)  import/no-named-as-default-member

I get about 50 of those logged. I was under the impression that node_modules should be ignored, so not sure what is going on here either.

EDIT: For what its worth we are like | | close to replacing moment with date-fns and have an actively open PR for the change that needs to be reviewed/merged, but it is interesting nonetheless that its erroring like this.

[nicolo-ribaudo]

@reintroducing I think that it's because you are using a .babelrc file (which is not applied to your dependencies) rather than babel.config.json/babel.config.js (which is applies to the whole app).

[reintroducing]

@nicolo-ribaudo we are using the babel entry in package.json to extend our babel preset (we also define our prettier, eslint, and stylelint configs in this manner). is the recommendation to use the babel.config.js file instead? is there any reason why there are differences in implementation across the board?

[nicolo-ribaudo]

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.

[reintroducing]

@nicolo-ribaudo you're correct, offloading the preset extension to babel.config.json fixed that issue (and in reading the docs looks like thats the recommended way to include babel configs). thank you.

[nicolo-ribaudo]

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).

[reintroducing]

For what its worth, I think there is an unanswered question posed by @ljharb for @JLHwung to help resolve this issue in the import plugin.

[nicolo-ribaudo]

Yeah but it's a question specific to ESLint, not related to Babel 😅