JSX 지원...

묘사

의견을 처리할 수 없습니다.jsx 파일...JSX가 vim을 곤혹스럽게 하지만...
이 문제를 해결할 수 있는 어떤 방법이 있습니까?

토론 #1

봐봐FAQ

토론 #2

JSX원소는 표준//또는/*/주석을 사용하여 주석할 수 없어.일반적으로 {/**/}을 사용합니다.
autocmd 파일 형식 jsx setlocal commentstring={/\%s
autocmd 파일 형식javascript.jsx setlocal commentstring={/\%s
다 해봤어요.
일 안 해...
내 표정에 무슨 문제 있어...

토론 #셋

저는 jsx를 간단명료하게 연구했습니다. 에서 볼 때//는 한마디로 곤혹스러울 것 같습니다. 제가 뭘 놓쳤나요?

토론 #4

네...정확//jsx에 적용...하지만 가끔은...다른 스타일이 필요해...

토론 #5

자동 명령을 발효시키려면 filetype plugin on 이후에 호출해야 한다.아니면 set commentstring=...을 직접 넣는다after/ftplugin/jsx.vim.

토론 #6

@tpope의 해결 방안을 따라가기 위해 설정을 통해set commentstring={/*\ %s\ */} ~/.vim/bundle/vim-jsx/after/ftplugin/jsx.vim (또는 당신의 bundle dir가 있는 곳)

토론 #7

tpope가 묘사한 바와 같이...겸사겸사 한마디 하자면...tcomment plugin for JSX는 JSX보다 훨씬 낫다. 왜냐하면 JSX는 두 개의 다른 주석이 있기 때문이다. 이것은 상하문, JSX 또는wahtever의 내연 주석에 달려 있기 때문이다.Tcomment 플러그인은 많은 모듈화

토론 #8

autocmd FileType javascript.jsx setlocal commentstring={/*\ %s\ */}

토론 #9

를 제공하여 훌륭합니다...

토론 #10

두 댓글 사이를 쉽게 전환할 수 있는 방법은 없나요?
jsx 파일에서 일반적으로 먼저 JS가 있고 그 다음에 jsx가 있다. jsx 블록에서commntstring{/*\ %s\ */}은 정상적으로 작동할 수 있지만 JS 블록/*\ %s\ */에서는 효과가 더욱 좋다. 예를 들어 다음과 같다.
'React'에서 React, {Component} 가져오기;

class Test extends Component {
    render() {
        /* console.log('test');*/
        return (
            <div>
                {/*<span>test</span>*/}
                <span>test</span>
            </div>
        )
    }
}

export default Test;

토론 #11

나는 먼저 당신의 테스트 항목에 eslint를 설정할 것입니다. 왜냐하면 당신이 일을 한 후에 그것이 물건을 파괴할 때 실망할 수 있기 때문입니다.
나는 너의 평론 구역을 말할 수 없다.JSX 영역에 있는 js 파일은 강조표시되지 않았습니다. (회색)
나는 줄곧 이 평론이 js나 jsx에 적용되는지 반복해서 생각하고 있다.
-afk mcz
네, 아마도 어제 이 해결 방안이 생겼을 거예요. 그러나 현재 프로젝트에서 붕괴됐어요.내 방법은 (vim Commentation과vim context commentstring)
두 개의 플러그를 설치합니다.
- 어떤 설정도 사용하지 않고 설명 편집
- 컨텍스트 주석 문자열에 다음 설정을 사용합니다.
vim context commentstring bundle/autoload/context/commentstring에 있습니다.윌
파일에 추가해야 합니다.
탁자.jsx는 (새로운) 부분이고, 나머지 부분은 이미 존재합니다let g:context#commentstring#table.jsx = { \ 'jsxStatment' : '/*%s*/', \ 'jsxRegion' : '{/*%s*/}', \}만약 일이 잘 된다면,react jsx에 파일 형식 분배를 추가해야 합니다autocmd! BufRead,BufNewFile *.{jsx,jx,js} setlocal filetype=javascript.jsx자바스크립트를 추가해야 할 수도 있습니다.jsx에서 machit 플러그인 설정과emmet 또는 다른 모르는 플러그인입니다.js는javascript입니다.jsx 파일 형식.
기왕 성공한 이상 나는 이 프로젝트에서 더 많은 일을 했다.linting을 추가하는 것은 이 설정을 깨뜨린 것 같습니다. 현재 파일 영역은 jsBlock이나 jsParen이기 때문에 jsxRegion의 소리가 끊기고 끊기는 것을 볼 수 있습니다.나는 이미 이 때문에 몇 시간 동안 일했다.모든 리뷰는//in any입니다.js 파일
주의:scriptease 플러그인이 있거나 설치되어 있다면, zS를 사용하여 커서 아래의 정확한 코드 영역 목표를 알려주십시오
주석이/과 {/로 설정되지 않았음에도 불구하고, 제 코드 문법은 jsx와javascript 영역에서 회색으로 바뀌었습니다. 이것이 주요 원인입니다. 그러나//렌더링 블록에는 특별한 의미가 없고, 코드 렌더링을 막을 수 없습니다.

토론 #12

@nightsdark 올바른 방향에 대한 조언에 감사드립니다.
suy/vim 상하문commentstringpull request을 만들었습니다. JS와 TS에 대한 React comments 지원이 포함되어 있습니다.
~~ 지금부터 사용하고 싶은 분들은 제 fork부터 플러그인을 설치하세요~~
UPD: 원본 플러그인

토론 #13

에 통합되었습니다. 또한, 이 프로젝트의 다른 지점에서 Vue 지원을 추가했지만, 저자가 PR을 만들지 않았습니다. 그래서 저도 제 PR

토론 #14

@Arelav에 이 코드를 포함했습니다. 이 공헌을 보십시오. 저는 성공을 거두었고, 문제가 있습니다. 일부 논평 구역에는 논평을 발표하지 않았습니다.나 이제 댓글 컨트롤 할 수 있어.

let g:context#commentstring#table['javascript.jsx'] = {
            \ 'jsComment' : '// %s',
            \ 'jsImport' : '// %s',
            \ 'jsxStatment' : '// %s',
            \ 'jsxRegion' : '{/*%s*/}',
\}

자바스크립트에 대해 일반적인 js 주석처럼 보입니다// import 'React', component from 'react'블록의 JSX 주석을 되돌려줍니다.

    render() {
        return (
            <div className="app">
            {/*    <a><img src="#2.jpg" /></a> */}
            </div>
        )

*외부 div 태그는 JSX 코드에서만 유지됩니다.*

토론 #15

@nightsdark 나는vim 설정을 변경했고 영역은 jsxRegion으로 변경했습니다.
그래서 나는 네가 건의한 변화를 포함해서 새로운 홍보를 만들었다.
https://github.com/suy/vim-context-commentstring/pull/3/commits

토론 #16

@Arelav를 한 번 봤는데 아주 좋아 보여요.Typescript에 대한 새로운 지원도 추가되었습니다.너도 jsxTag이 있는 걸 봤어.jsxTag을 찾아보겠습니다. 아직 찾지 못했습니다.나는 xmlTag과 xmlTagBlock이 하나 있지만문장의 되돌아오는 줄에 사용합니다.

  render() {
    return <div className='container'>
      <div className='full-header'></div>
      <div className='page-container'>
        <div className='header'>
          <Navigation />
          <Router />
        </div>
      </div>
    </div>
  }

그러나 모든 것은 여전히 유효하다.

class App extends Component {
  render() {
    {/* return <div className='container'> */}
    {/*   <div className='full-header'></div> */}
    {/*   <div className='page-container'> */}
    {/*     <div className='header'> */}
    {/*       <Navigation /> */}
    {/*       <Router /> */}
    {/*     </div> */}
    {/*   </div> */}
    {/* </div> */}
  }
}

그리고

class App extends Component {
  // render() {
  //   return <div className='container'>
  //     <div className='full-header'></div>
  //     <div className='page-container'>
  //       <div className='header'>
  //         <Navigation />
  //         <Router />
  //       </div>
  //     </div>
  //   </div>
  // }
}

토론 #17

@nightsdark 이것은 당신이 사용하는 JSX/TSX 문법 플러그인에 달려 있다고 생각합니다.peitalin/vim-jsx-typescript를 사용하고 타자 스크립트에서 전환합니다.tsx 파일 형식 스크립트플러그인은 이 파일 형식만 지원하기 때문입니다.
설정은 autocmd BufNewFile,BufRead *.tsx,*.jsx set filetype=typescript.jsx

토론 #18

입니다. 저는 여전히 원래의 플러그인을 사용합니다. 왜냐하면 지난번에 제 PR이 곧 승인되었기 때문입니다.하지만 이번에는 시간이 필요해서 포크로 대체하는 것을 고려하기 시작했다.홍보관을 만드신 것을 환영합니다. 아니면 저에게 평론만 해 주십시오. 당신이 부족한 것이 있으면 포크를 보충해 드리겠습니다.

토론 #19

설치vim-context-commentstring를 한 후에 제가 별도의 일을 해야 합니까?
내 commentstring는 내 파일의 import 부분에 변화가 생겼다. 비야디는 어느 곳에서든 JSXcommentstring를 사용하는데 JS

토론 #20

@afk mcz가 아니다. 이것은 네가 사용하는 JS/JSX 문법 플러그인에 달려 있다.
기존의 문법 플러그인은 매우 적다.
또한vimrc에서 변경하고 싶을 수도 있습니다 autocmd BufNewFile,BufRead.너는 나의 6월 11일 평론에서 이 참고를 볼 수 있다.
또한 tpope/vim-scriptease 단축키로 플러그인 zS 을 사용하면 특수 줄에 정의된 영역을 볼 수 있습니다.

토론 #21

변경 let g:context#commentstring#table['javascript.jsx']의 설정을 어디에 두시겠습니까? 저vimrc에 놓으려고 합니다. 이것은 정의되지 않은 것으로 보입니다. autoload/context/commentstring.vim 파일에 있습니다.

토론 #22

@afk mcz를 열 때 변수가 정의되지 않았을 수도 있습니다. 저도vimhandlebars 플러그인을 사용하고 있습니다. 이것은bundle/vimhandlebars/ftdetect/handlebars에서 작동합니다.윌

if has("autocmd")
  au BufNewFile,BufRead *.{handlebars,hb,hbs,hbt,html}{,.erb} set ft=handlebars.html syntax=handlebars | runtime! ftplugin/handlebars.vim ftplugin/handlebars*.vim ftplugin/handlebars/*.vim
endif

이것은 bundle/vim jsx/ftdetect/javascript에 대한 것입니다.윌

 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" Vim ftdetect file
"
" Language: JSX (JavaScript)
" Maintainer: Max Wang <[email protected]>
"
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""

" Whether the .jsx extension is required.
if !exists('g:jsx_ext_required')
  let g:jsx_ext_required = 1
endif

" Whether the @jsx pragma is required.
if !exists('g:jsx_pragma_required')
  let g:jsx_pragma_required = 0
endif

let s:jsx_pragma_pattern = '\%^\_s*\/\*\*\%(\_.\%(\*\/\)\@!\)*@jsx\_.\{-}\*\/'

" Whether to set the JSX filetype on *.js files.
fu! <SID>EnableJSX()
  if g:jsx_pragma_required && !exists('b:jsx_ext_found')
    " Look for the @jsx pragma.  It must be included in a docblock comment
    " before anything else in the file (except whitespace).
    let b:jsx_pragma_found = search(s:jsx_pragma_pattern, 'npw')
  endif

  if g:jsx_pragma_required && !b:jsx_pragma_found | return 0 | endif
  if g:jsx_ext_required && !exists('b:jsx_ext_found') | return 0 | endif
  return 1
endfu

autocmd BufNewFile,BufRead *.jsx let b:jsx_ext_found = 1
autocmd BufNewFile,BufRead *.jsx set filetype=javascript.jsx
autocmd BufNewFile,BufRead *.js if <SID>EnableJSX() | set filetype=javascript.jsx | endif

이거 너의vimrc에 넣어.

  let g:context#commentstring#table['javascript.jsx'] = {
            \ 'jsComment' : '// %s',
            \ 'jsImport' : '// %s',
            \ 'jsxStatment' : '// %s',
            \ 'jsxRegion' : '{/*%s*/}',
            \}
let g:context#commentstring#table['handlebars.html'] = {
            \ 'hbsInside' : '{{!--*%s*--}}',
            \}

상하문 주석 문자열 테이블에 추가됩니다. 파일의 상하문이나 영역에 따라 코드를 주석할 수 있고,vim를 종료해야 합니다. 원본vim이 아닌 종료해야 효과를 볼 수 있습니다.

토론 #23

다른 방법은 nerd commenter와 같은 다른 평론 도구를 설치하는 것이다.그리고 한 파일은 다른 귀속을 할 수 있습니다.

토론 #24

내가 잘못했어.

Undefined variable: g:context#commentstring#table

이것은 매우 쓸모가 있다" JSX commentary if exists('g:context#commentstring#table') let g:context#commentstring#table['javascript.jsx'] = { \ 'jsComment' : '// %s', \ 'jsImport' : '// %s', \ 'jsxStatment' : '// %s', \ 'jsxRegion' : '{/*%s*/}', \} endif