Тег <> не работает в React с Visual Studio даже при обновленных реакциях, узлах и npm - PullRequest
0 голосов
/ 22 мая 2019

Я создал ASP.NET Core 2.2 с реагирующим шаблоном. После этого я обновил React, Node и npm, но у меня все еще есть проблема с тегом <>. Мне нужно использовать <React.Fragment>.

Я установил внешний node.js в Visual Studio 2019, обновил React, Node и npm. Узел v11.13.0, npm 6.9.0, «прореагировать»: «^ 16.8.6».

import React, { Component } from "react";
import Home from "./home/home";

export class Test extends Component {
  render() {
    return (
      <>
        <Home />
        <Home />
      </>
    );
  }
}

Когда я запускаю его в своем браузере, в консоли отображается эта ошибка.

Syntax error: D:/NetRepos/ItalySettlers/ItalySettlers/ClientApp/src/components/test.jsx: Unexpected token (7:7)

   5 |   render() {
   6 |     return (
>  7 |       <>
     |        ^
   8 |         <Home />
   9 |         <Home />
  10 |       </>

С <React.Fragment> все отлично работает.

Это мой package.json

    {
  "name": "ItalySettlers",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.18",
    "@fortawesome/free-brands-svg-icons": "^5.8.2",
    "@fortawesome/react-fontawesome": "^0.1.4",
    "axios": "^0.18.0",
    "bootstrap": "^4.3.1",
    "google-map-react": "^1.1.4",
    "google-trends-api": "^4.9.0",
    "jquery": "3.3.1",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-router-bootstrap": "^0.24.4",
    "react-router-dom": "^4.3.1",
    "react-scripts": "^1.1.5",
    "reactstrap": "^6.5.0",
    "rimraf": "^2.6.3"
  },
  "devDependencies": {
    "@babel/core": "^7.4.4",
    "@babel/plugin-transform-react-jsx": "^7.3.0",
    "@babel/preset-react": "^7.0.0",
    "ajv": "^6.10.0",
    "babel-eslint": "^9.0.0",
    "cross-env": "^5.2.0",
    "eslint": "^4.1.1",
    "eslint-config-react-app": "^2.1.0",
    "eslint-plugin-flowtype": "^2.50.3",
    "eslint-plugin-import": "^2.17.2",
    "eslint-plugin-jsx-a11y": "^5.1.1",
    "eslint-plugin-react": "^7.13.0"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "scripts": {
    "start": "rimraf ./build && react-scripts start",
    "build": "react-scripts build",
    "test": "cross-env CI=true react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "lint": "eslint ./src/"
  }
}

EDIT:

Как видите, у меня есть "@babel/core": "^7.4.4", который указывает, что все должно работать, особенно когда в документации написано Support for JSX fragments is available in Babel v7.0.0-beta.31 and above! Документация

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...