응답 단편 단축을 컴파일하지 못했습니다.

응답 단편 단축을 컴파일하지 못했습니다.

문제의 프로젝트는 Fragments와 Fragment sermand를 사용하는 기능을 가진 React-16.2.0을 사용하고 있습니다.

https://reactjs.org/blog/2017/11/28/react-v16.2.0-fragment-support.html

전체 길이 구문은 정상적으로 동작하지만...

import React, { Fragment, Component } from 'react';

class TestingFragment extends Component {
    render() {
        return (
            <Fragment>
                <span>This is a fragment of text </span>
                <div>Another part of the fragment</div>
            </Fragment>
        )
    }
};

export default TestingFragment

그 속기는 편집에 실패했고 나는 이것이 왜 그런지 막막하다.예시...

import React, { Component } from 'react';

class TestingFragment extends Component {
    render() {
        return (
            <>
                <span>This is a fragment of text </span>
                <div>Another part of the fragment</div>
            </>
        )
    }
};

export default TestingFragment

다음과 같이 컴파일할 수 없습니다.

Failed to compile
./src/testingFragments.js
Syntax error: Unexpected token (6:4)

  4 |   render() {
  5 |       return (
> 6 |           <>
    |            ^
  7 |               <span>This is a fragment of text </span>
  8 |               <div>Another part of the fragment</div>
  9 |           </>
This error occurred during the build time and cannot be dismissed.

fragment 속기 구문에 대해 뭔가 부족한 점이 있습니까?

이게 이유인 것 같아요.

https://reactjs.org/blog/2017/11/28/react-v16.2.0-fragment-support.html#support-for-fragment-syntax

스크린샷

create-react-apps는 현재 React를 완전히 지원하기 위해 Babel 6.26.0을 사용하고 있습니다.프래그먼트가 Babel v7.0.0-beta.31 이후 필요

======================= 편집

이제 create-module-app v2 https://reactjs.org/blog/2018/10/01/create-react-app-v2.html에서 사용할 수 있습니다.

이 불쌍한 남자의 단편 속기를 빠른 해결책으로 사용할 수 있습니다.[ , ]

render(){
  return [
    <div key="f">foo</div>,
    <div key="b">bar</div>
  ]
}

노드 배열이 유효한 jsx 요소이기 때문입니다.를 추가해야 합니다.keyAnarno가 지적한 바와 같이 수동으로 각 소품을 장착합니다.

프래그먼트 구문은 Babel v7.0.0-beta에서만 지원됩니다.31 이상

언급URL : https://stackoverflow.com/questions/48316365/react-fragment-shorthand-failing-to-compile