Eslint-plugin-jsx-a11y: Error in 6.2.2: Cannot find module '@babel/runtime/helpers/interopRequireDefault'

Created on 30 Jun 2019  路  9Comments  路  Source: jsx-eslint/eslint-plugin-jsx-a11y

After running an npm update I started seeing this error when linting my code:

Error: Cannot find module '@babel/runtime/helpers/interopRequireDefault'
Require stack:
- /.../node_modules/eslint-plugin-jsx-a11y/lib/rules/accessible-emoji.js
- /.../node_modules/eslint-plugin-jsx-a11y/lib/index.js
- /.../node_modules/eslint/lib/config/plugins.js
- /.../node_modules/eslint/lib/config.js
- /.../node_modules/eslint/lib/cli-engine.js
- /.../node_modules/eslint/lib/cli.js
- /.../node_modules/eslint/bin/eslint.js
Referenced from: /.../node_modules/eslint-config-airbnb/index.js
Referenced from: /.../.eslintrc.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:623:15)
    at Function.Module._load (internal/modules/cjs/loader.js:527:27)
    at Module.require (internal/modules/cjs/loader.js:681:19)
    at require (internal/modules/cjs/helpers.js:16:16)
    at Object.<anonymous> (/.../node_modules/eslint-plugin-jsx-a11y/lib/rules/accessible-emoji.js:3:30)
    at Module._compile (internal/modules/cjs/loader.js:774:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:785:10)
    at Module.load (internal/modules/cjs/loader.js:641:32)
    at Function.Module._load (internal/modules/cjs/loader.js:556:12)
    at Module.require (internal/modules/cjs/loader.js:681:19)

Forcing eslint-plugin-jsx-a11y back to 6.2.1 (but allowing all other package updates including dependencies of eslint-plugin-jsx-a11y) resolved the issue.

Relevant dependencies:

"@typescript-eslint/eslint-plugin": "^1.10.2",
"@typescript-eslint/parser": "^1.10.2",
"eslint": "^5.16.0",
"typescript": "^3.5.2",

Update: I have also observed the same error in a non-typescript (and much smaller) codebase.

Script:

eslint --cache --format codeframe --ext mjs,jsx,js --report-unused-disable-directives src",

Dependency list:

"@babel/preset-env": "^7.4.5",
"@neutrinojs/airbnb": "^9.0.0-rc.3",
"@neutrinojs/node": "^9.0.0-rc.3",
"core-js": "^3.1.4",
"eslint": "^5.16.0",
"eslint-plugin-eslint-comments": "^3.1.2",
"neutrino": "^9.0.0-rc.3",
"webpack": "^4.35.0",
"webpack-cli": "^3.3.5"

Most helpful comment

After generating a MCVE I believe this is due to using this library on a non-react codebase. Until the latest version, this was OK (although admittedly weird; caused by sharing configs between various parts of the same app). Now, it produces this error.

Minimal reproduction (note that downgrading to 6.2.1 runs fine, but 6.2.2. crashes out):

package.json

{
  "name": "a11y-bug-repro",
  "scripts": {
    "lint": "eslint src"
  },
  "devDependencies": {
    "eslint": "^5.16.0",
    "eslint-plugin-jsx-a11y": "6.2.2"
  }
}

.eslintrc.js

module.exports = {
  plugins: ['jsx-a11y'],
};

src/index.js

function add(a, b) {
  return a + b;
}

@davidje13 mucho thanks for the repro. I got the error straight away. @babel/runtime is listed in devDependencies. It should be listed in dependencies. I'm addressing this in #619. I'll get a release out soon.

All 9 comments

Are you perhaps transpiling node_modules with Babel? That鈥檚 generally a bad idea.

@ljharb this happens just after the update. no configuration changes were done.

@ljharb I certainly hope not. As you can see in the listed dependencies I'm using neutrino to manage the webpack/babel configuration. Here's the output of neutrino --inspect (i.e. the input given to webpack):

(path to project replaced with .../project and some irrelevant rule configurations removed)

{
  mode: 'development',
  target: 'node',
  devtool: 'inline-sourcemap',
  externals: [
    function (context, request, callback){
        var moduleName = getModuleName(request, includeAbsolutePaths);
        if (utils.contains(nodeModules, moduleName) && !utils.containsPattern(whitelist, request)) {
            if (typeof importType === 'function') {
                return callback(null, importType(request));
            }
            // mark this module as external
            // https://webpack.js.org/configuration/externals/
            return callback(null, importType + " " + request);
        };
        callback();
    }
  ],
  context: '/.../project',
  stats: {
    children: false,
    entrypoints: false,
    modules: false
  },
  node: {
    __filename: false,
    __dirname: false
  },
  output: {
    path: '/.../project/build',
    libraryTarget: 'commonjs2',
    devtoolModuleFilenameTemplate: '[absolute-resource-path]'
  },
  resolve: {
    extensions: [
      '.wasm',
      '.mjs',
      '.jsx',
      '.js',
      '.json'
    ]
  },
  module: {
    rules: [
      /* neutrino.config.module.rule('lint') */
      {
        test: /\.(mjs|jsx|js)$/,
        enforce: 'pre',
        include: [
          '/.../project/src'
        ],
        use: [
          /* neutrino.config.module.rule('lint').use('eslint') */
          {
            loader: '/.../project/node_modules/eslint-loader/index.js',
            options: {
              cache: true,
              cwd: '/.../project',
              emitWarning: true,
              failOnError: false,
              formatter: '/.../project/node_modules/eslint/lib/formatters/codeframe.js',
              useEslintrc: false,
              rules: {
              },
              baseConfig: {
                env: {
                  es6: true
                },
                'extends': [
                  '/.../project/node_modules/eslint-config-airbnb/index.js',
                  'plugin:eslint-comments/recommended',
                  'plugin:jest/recommended'
                ],
                globals: {
                  process: true
                },
                overrides: [],
                parser: '/.../project/node_modules/babel-eslint/lib/index.js',
                parserOptions: {
                  ecmaVersion: 2018,
                  sourceType: 'module'
                },
                plugins: [
                  'babel'
                ],
                root: true,
                settings: {
                  react: {
                    version: '999.999.999'
                  }
                },
                rules: {
                }
              }
            }
          }
        ]
      },
      /* neutrino.config.module.rule('compile') */
      {
        test: /\.(mjs|jsx|js)$/,
        include: [
          '/.../project/src'
        ],
        use: [
          /* neutrino.config.module.rule('compile').use('babel') */
          {
            loader: '/.../project/node_modules/babel-loader/lib/index.js',
            options: {
              cacheDirectory: true,
              babelrc: false,
              configFile: false,
              presets: [
                [
                  '/.../project/node_modules/@babel/preset-env/lib/index.js',
                  {
                    targets: {
                      node: 'current'
                    }
                  }
                ]
              ],
              plugins: [
                '/.../project/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js'
              ]
            }
          }
        ]
      }
    ]
  },
  plugins: [
    /* neutrino.config.plugin('start-server') */
    new (require('/.../project/node_modules/start-server-webpack-plugin/dist/StartServerPlugin.js'))(
      {
        name: 'index.js',
        nodeArgs: []
      }
    ),
    /* neutrino.config.plugin('hot') */
    new (require('/.../project/node_modules/webpack/lib/HotModuleReplacementPlugin.js'))()
  ],
  entry: {
    index: [
      '/.../project/src/index',
      '/.../project/node_modules/webpack/hot/poll.js?1000'
    ]
  }
}

As you can see, there's nothing explicitly telling it to manipulate node_modules files, but also nothing telling it not to. I'm not sure what the default behaviour of webpack/babel is, but I hope it leaves node_modules sources untouched.

The generated .eslintrc.js config is:

{
  env: { es6: true },
  extends: [
    '/.../project/node_modules/eslint-config-airbnb/index.js',
    'plugin:eslint-comments/recommended',
    'plugin:jest/recommended'
  ],
  globals: { process: true },
  overrides: [],
  parser: '/.../project/node_modules/babel-eslint/lib/index.js',
  parserOptions: { ecmaVersion: 2018, sourceType: 'module' },
  plugins: [ 'babel' ],
  root: true,
  settings: { react: { version: '999.999.999' } },
  rules: {
  }
}

The neutrino config which generated this is:

const airbnb = require('@neutrinojs/airbnb');
const jest = require('@neutrinojs/jest');
const node = require('@neutrinojs/node');

module.exports = {
  options: {
    tests: 'src',
  },
  use: [
    airbnb({
      eslint: {
        baseConfig: {
          extends: [
            'plugin:eslint-comments/recommended',
          ],
        },
      },
    }),
    jest({
      bail: true,
    }),
    node({
      babel: {
        presets: [
          ['@babel/preset-env', {
            targets: {
              node: 'current',
            },
          }],
        ],
      },
    }),
  ],
};

Lint command:

eslint --cache --format codeframe --ext mjs,jsx,js --report-unused-disable-directives src

Do you have Babel core as a top level dev dep? What does npm ls print out?

After generating a MCVE I believe this is due to using this library on a non-react codebase. Until the latest version, this was OK (although admittedly weird; caused by sharing configs between various parts of the same app). Now, it produces this error.

Minimal reproduction (note that downgrading to 6.2.1 runs fine, but 6.2.2. crashes out):

package.json

{
  "name": "a11y-bug-repro",
  "scripts": {
    "lint": "eslint src"
  },
  "devDependencies": {
    "eslint": "^5.16.0",
    "eslint-plugin-jsx-a11y": "6.2.2"
  }
}

.eslintrc.js

module.exports = {
  plugins: ['jsx-a11y'],
};

src/index.js

function add(a, b) {
  return a + b;
}

And in that minimal repro, npm ls exits successfully?

@ljharb npm ls returns no errors or warnings and exits with status code 0.

npm install complains about missing description / repository field / license in the JSON, but nothing about the dependencies. Specifically, nothing complains about unmet peer dependencies.

Interestingly, I notice that my minimal reproduction example is almost identical to the result of the getting-started instructions in the project readme.

After generating a MCVE I believe this is due to using this library on a non-react codebase. Until the latest version, this was OK (although admittedly weird; caused by sharing configs between various parts of the same app). Now, it produces this error.

Minimal reproduction (note that downgrading to 6.2.1 runs fine, but 6.2.2. crashes out):

package.json

{
  "name": "a11y-bug-repro",
  "scripts": {
    "lint": "eslint src"
  },
  "devDependencies": {
    "eslint": "^5.16.0",
    "eslint-plugin-jsx-a11y": "6.2.2"
  }
}

.eslintrc.js

module.exports = {
  plugins: ['jsx-a11y'],
};

src/index.js

function add(a, b) {
  return a + b;
}

@davidje13 mucho thanks for the repro. I got the error straight away. @babel/runtime is listed in devDependencies. It should be listed in dependencies. I'm addressing this in #619. I'll get a release out soon.

@davidje13 thanks again for the repro steps. Fixed in v6.2.3.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

JosephNK picture JosephNK  路  4Comments

oliviertassinari picture oliviertassinari  路  4Comments

AlmeroSteyn picture AlmeroSteyn  路  5Comments

diegohaz picture diegohaz  路  5Comments

davidleger95 picture davidleger95  路  4Comments