하위 등급의 반응 코드에 대한 구문 강조 표시

하위 등급의 반응 코드에 대한 구문 강조 표시

기본적인 리액트 코드를 숭고한 글씨로 쓰기 시작했어요구문 강조 표시는 다음과 같습니다.부분적으로 강조되어 있습니다.완전한 구문 강조 표시를 위해 사용할 수 있는 권장 서브 라임 플러그인이 있습니까?

import React, { Component } from 'react'
import { connect } from 'react-redux'   // <-- is the glue between react and redux
import { bindActionCreators } from 'redux'
import { selectBook } from '../actions/index'

// there is no intrinsic connection between React and Redux
// they are two seperate libraries
// they are connected using a seperate library called ReactRedux

// container? its a React component that hasa direct connection to state managed by Redux
class BookList extends Component {

    constructor(props) {
        super(props)
        //this.props = props;
    }

    renderList() {
        return this.props.books.map((book) => {
            return (
                <li key={book.title} className="list-group-item">{book.title}</li>
            )
        })
    }

    render() {
        return (
            <ul className="list-group col-sm-4">
                {this.renderList()}
            </ul>
        )
    }

}

// function is the glue between react and redux
function mapStateToProps(state) {
    // Whatever gets retrieved from here will show up as props inside
    // of book-list

    return {
        books: state.books
    }
}

// anything returned from this function will end up as props on the BookList container
function mapDispatchToProps(dispatch) {
    return bindActionCreators({selectBook: selectBook}, dispatch)
}

// Promote BookList from a component to a container - it needs to know
// about this new dispatch method, selectBook. Make it available as a prop
export default connect(mapStateToProps, mapDispatchToProps)(BookList);

편집: [잘못된 구문 수정, 코드 텍스트 추가]

babel을 설치하면 구문 강조 표시가 수정됩니다.

sublime3에 babel을 설치하는 단계:

1. Windows의 경우: ++ShiftP를 누릅니다(Mac의 경우:ShiftP ++).
2. 그런 다음 입력합니다. install를 선택합니다. Package control: Install Package
3. 그런 다음 입력합니다. Babel를 선택합니다. 'Babel-Snippets'. 잠시 후 babel이 설치됩니다.
   
4. 다음으로 Sublime3 Editor에서 Babel 구문을 설정합니다.View > Syntax > Babel > Javascript

일부 사용자의 경우,Babel4단계에서 누락되었습니다.추가 설치 가능 Babel같은 절차를 밟아 선택함으로써Babel대신 이번에는Babel-Snippets스텝 3에서.

테스트한 것을 확인합니다.

를 인스톨 할 필요가 있습니다.babel-sublime플러그 인.

설치처:package control숭고한

https://github.com/babel/babel-sublime 의 링크는 다음과 같습니다.

• 순서 1 - [Package Control](++)으로 이동합니다.
• 순서 2 - 설치 패키지 선택
• 스텝 3 - JSX 플러그인을 검색하여 설치합니다.
• 스텝 4 - 다음으로 Sublime3 Editor에서 JSX 구문을 설정합니다.[ View ]> [ Syntax ]> [ JSX ]를 표시합니다.

파일 이름 사용.jsx확장

1- 패키지 제어로 이동합니다.2- naomi-syntax를 검색하여 설치합니다.3- Sublime3 Editor에서 naomi-syntax 구문을 설정합니다.[ View ]> [ Syntax ]> [ nomii - syntax

구문을 JSX로 설정하여 해결할 수 있었습니다.이 플러그인은 설치할 필요가 없었습니다.

언급URL : https://stackoverflow.com/questions/41319547/syntax-highlighting-for-react-code-in-sublime