jsx文件React-Native的意外令牌问题答案

【问题标题】：Unexpected token issue with jsx files React-Nativejsx文件React-Native的意外令牌问题
【发布时间】：2020-09-12 14:23:15
【问题描述】：

所以前几天我刚刚初始化了一个 React Native 项目并尝试配置我的 eslint，但由于某种原因，我在返回无状态 JSX 组件时收到了 unexpected token < 错误。

import React from 'react';

const User = () => {
  return (
    <>
      <Text>
        Hello!
      </Text>
    </>
  );
};

export default User

我正在扩展用于初始化 eslintrc 文件的默认 @react-native-community。作为另一个说明，我试图使用 airbnb eslint 配置，这会导致同一位置的 js 和 jsx 文件出现意外的令牌错误。我想知道是否有人知道我收到此错误的原因。提前感谢您的帮助！

已修复：如下所述，我的修复最终是安装 babel-eslint 并将我的解析器设置为 eslintrc 文件中的 babel-eslint。

【问题讨论】：

可能是 linter 无法识别 Fragments <> 的短语法。尝试使用<React.Fragment>。
尝试过使用任何元素。仍然没有工作。我试图在其中单独放置一个 Text 元素，但它仍然对我大喊大叫。
try this
humanbean 的上述链接对我有用！我安装了 babel-eslint 并将我的解析器设置为 eslintrc 内的 babel-eslint 并修复了所有问题。谢谢！
从上面的链接中，添加parser: 'babel-eslint' 为我解决了这个问题。

【解决方案1】：

你需要导入 React。

import React from 'react   
const User = () => {
  return (
    <>
      <Text>
        Hello!
      </Text>
    </>
  );
};

export default User

【讨论】：