모듈 빌드 실패 : SyntaxError : 예기치 않은 토큰

Question

React를 처음 사용했습니다. 온라인 학습 리소스에서 예제 코드를 실행하려고하지만 완전히 혼란스럽게 만드는 오류가 발생했습니다. 아무도 정확히 무엇이 잘못되었는지 알려 줄 수 있습니까?

가 나는 Refs.js를 생성하고 코드가

import React, { Component } from 'react'; 

class Refs extends Component { 

    state = { liked: false } 

    handleClick = (event) => { 
    this.setState({liked: !this.state.liked}); 
    } 

    render() { 
    let text = this.state.liked ? 'Like' : 'Dislike'; 

    return (
     <p onClick={this.handleClick}> 
     I {text} Apple. 
     </p> 
    ); 
    } 
} 

export default Refs; 

아래에 나열되어 내가 모듈 빌드가 실패 오류가있어 : 구문 에러 :

5 | class Refs extends Component { 
    6 | 
> 7 | state = { liked: false } 
    |  ^
    8 | 
    9 | handleClick = (event) => { 
    10 |  this.setState({liked: !this.state.liked}); 

또한 예기치 않은 토큰을, 나는 코드 발견 스타일에 대한 서로 다른 온라인 리소스에 대한 서로 큰 차이가 있습니다 () 클래스 Refs extends Component 또는 클래스 Refs는 React.Component 또는 var Refs = React.createClass를 확장합니다.). 누구나 반응에 대한 정확한 코드 표준이 무엇인지 말할 수 있습니까? 나는 React가 전에 배웠던 JQuery/Angular와 비교하여 정말 혼란 스럽다는 것을 알게되었습니다. 이제는 클래스에서 변수를 선언 할 수 있는지 여부를 알지 못합니다. 나는이 질문에 많은 질문을 던졌다. 하지만 누군가가 내 혼란을 해결하는 데 도움이되기를 바랍니다. 미리 감사드립니다. 워드 프로세서에 지정된

Answer 1

당신은 here

당신이이

constructor(props) { 
    super(props); 

    this.state = { 
     liked: false 
    }; 
} 

같은 것입니다 경우에 constructor 기능을 추가 할 필요가