Если жалуются на неиспользованный React var

Question

У меня есть файл, который выглядит следующим образом:

import React from 'react';
import PropTypes from 'prop-types';

const I18NLanguage = (props) => {
    const {code, i18n} = props;

    const languageMap = {
        'en': i18n.english,
        'es': i18n.spanish,
        'fr': i18n.french,
        'de': i18n.german,
        'pt': i18n.portuguese,
        'zh-Hans': i18n.simplifiedChinese,
        'zh-Hant': i18n.traditionalChinese,
        'ja': i18n.japanese
    }
    return (
        <>
            {languageMap[code]}
        </>
    )
};

I18NLanguage.propTypes = {
    code: PropTypes.string.isRequired,
    i18n: PropTypes.object.isRequired
};

export default I18NLanguage;

// const Input = ({ label, text, type, id, value, handleChange }) => (
//     <div className='form-group'>
//       <label htmlFor={label}>{text}</label>
//       <input
//         type={type}
//         className='form-control'
//         id={id}
//         value={value}
//         onChange={handleChange}
//         required
//       />
//     </div>
//   );

// Input.propTypes = {
//     label: PropTypes.string.isRequired,
//     text: PropTypes.object.isRequired,
//     type: PropTypes.string.isRequired,
//     id: PropTypes.element.isRequired,
//     value: PropTypes.element.isRequired,
//     handleChange: PropTypes.element.isRequired
// };

// export default Input;

Когда я запускаю eslint, он выдает следующее сообщение об ошибке:

1: 8 ошибка «Реагировать» определена, но никогдаused no-unused-vars

Если я удаляю импорт, чтобы отреагировать, он жалуется на отсутствие импорта.Если я закомментирую все в примере кода, кроме двух импортов, и раскомментирую функцию ввода, и все, что находится под ней, это будет приятно.

Есть предложения, что может быть не так?Мой .eslintrc выглядит так:

{
    "parser": "babel-eslint",
    "parserOptions": {
      "sourceType": "module"
    },
    "env": {
      "browser": true,
      "node": true
    },
    "plugins": [
      "react"
    ],
    "rules": {
      "react/display-name": ["error", { "ignoreTranspilerName": false }],
      "react/no-find-dom-node": [0],
      "no-console": [0]
    },
    "extends": [
      "eslint:recommended",
      "plugin:react/recommended"
    ],
    "settings": {
      "react": {
        "version": "16.4"
      }
    },
    "globals": {
    }
  }

Спасибо, что уделили время.

Answer 1

Это потому, что eslint не распознает <> (фрагмент) как JSX, в то время как babel делает.

Не уверен, исправит ли обновление eslint, но вы можете попробовать.В противном случае просто используйте <Fragment> или отключите пометку строки: import React from 'react'; /* eslint-disable-line no-unused-vars */