TypeError: Cannot read property 'split' of undefined

[mahyarmirrashed]

Introduction

This issue seems to be similar to #2131 and #1785. From what I have observed, it only occurs when I run react-scripts start. However, when I execute eslint src/*, the error does not occur. This may or may not be important to debugging this error.

Details

eslint-plugin-react version: ^7.24.0

Exact error message received after running react-scripts start:

[Error - 1:52:26 a.m.] ESLint stack trace:
[Error - 1:52:26 a.m.] TypeError: Cannot read property 'split' of undefined
Occurred while linting C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\src\common\components\Copyright.tsx:3
    at checkDependencyDeclaration (C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint-plugin-import\lib\rules\no-extraneous-dependencies.js:133:40)
    at reportIfMissing (C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint-plugin-import\lib\rules\no-extraneous-dependencies.js:187:38)
    at commonjs (C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint-plugin-import\lib\rules\no-extraneous-dependencies.js:264:7)
    at checkSourceValue (C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint-module-utils\moduleVisitor.js:29:5)
    at checkSource (C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint-module-utils\moduleVisitor.js:34:5)
    at C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint\lib\linter\safe-emitter.js:45:58
    at Array.forEach (<anonymous>)
    at Object.emit (C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint\lib\linter\safe-emitter.js:45:38)
    at NodeEventGenerator.applySelector (C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint\lib\linter\node-event-generator.js:293:26)
    at NodeEventGenerator.applySelectors (C:\Users\mahmi\Documents\GitHub\patient-self-service-portal\node_modules\eslint\lib\linter\node-event-generator.js:322:22)

Source code producing error:

import * as React from 'react';
import { Link, Typography } from '@material-ui/core';
import { SxProps } from '@material-ui/system/styleFunctionSx/styleFunctionSx';

export type CopyrightProps = {
  sx: SxProps;
};

const Copyright: React.FunctionComponent<CopyrightProps> = ({ sx }) => (
  <Typography variant="body2" color="text.secondary" align="center" sx={sx}>
    {'Copyright &copy; '}
    <Link color="inherit" href="/">
      Affinity Patient Portal
    </Link>
    {` ${new Date().getFullYear()}.`}
  </Typography>
);

export default Copyright;

[AriPerkkio]

This is caused by eslint-plugin-import.

Occurred while linting C:\Users\<x>\patient-self-service-portal\src\common\components\Copyright.tsx:3
    at checkDependencyDeclaration (C:\<x>\node_modules\eslint-plugin-import\lib\rules\no-extraneous-dependencies.js:133:40)
                                                       ^^^^^^^^^^^^^^^^^^^^

See import-js/eslint-plugin-import#2120.

[mahyarmirrashed]

@AriPerkkio Somehow, this error disappeared after fixing the issue in mui/material-ui#27564. I have not tried it out with your proposed solution. I am going to close this for now since the issue is gone but feel free to reopen if necessary.