JavaScript 코딩을위한 권장 Vim 플러그인? [닫은]


125

JS & Vim을 처음 사용합니다. Javascript 코드 작성에 도움이되는 플러그인은 무엇입니까?


6
질문을보다 명확하게하고 향후 게시물에 대해 영어로 OP를 지원하려면 다음과 같이 읽어야합니다. "저는 JS & Vim을 처음 사용합니다. Javascript 코드를 작성하는 데 어떤 플러그인이 도움이됩니까?" " Javascript와 vim을 처음 사용 합니다 "라고 말할 수 있습니다 . "what is"를 단수로 사용할 수 있습니다. 예를 들어 " a_plugin 이란 무엇입니까 ?"또는 "복수를 위해"which "를 사용할 수 있습니다 :" Which_plugins help me ... ". 또한 대신 "플러그인 통지 있다가 "당신은 "플러그인을 사용해야 할 것이다 그것은 가상의"때문이다. 희망 :-)하는 데 도움이
hendrixski

3
@hendrixski-다시 열려면 투표하십시오.
ocodo

8
가장 건설적인 비 건설적인 질문.
Vladislav Zorov

8
나는이 "비 건설적인"질문이 어떻게 워크 플로우를 많이 향상시키는 데 도움이되었는지 매우 즐겁습니다.
MaiaVictor

질문은 (부당 히 IMO) 폐쇄되었으므로 여기에 의견을 추가하겠습니다. NeoVim의 전자 기반 프론트 엔드가 상자에 자동으로 입력 스크립트 언어 서버 자동 완성 기능이 있습니다 (바닐라 JS에서도 작동합니다!) : onivim.io . 여전히 가장자리에서 약간 거칠지 만 지금은 몇 주 동안 일일 드라이버로 사용하고 있으며 너무 많은 문제가 없었습니다. 주변에는 정말 좋은 커뮤니티가 있으며 매우 많은 개발이 진행 중이므로 앞으로도 좋은 것을 기대합니다! 전체 공개 : 저는 프로젝트에 매달 기부하고 미래에 기여할 계획입니다.
Parker Ault

답변:


116

구문 검사 / Linting

Syntastic Vim 플러그인을 사용하여 JSLint 또는 커뮤니티 주도 jshint.com (훨씬 더 나은 IMO)을 Vim과 통합하는 매우 쉬운 방법이 있습니다. 자세한 내용은 내 다른 게시물 을 참조하십시오.

소스 코드 브라우징 / 태그리스트

Cloud9 IDEAce 온라인 편집기 에서도 사용되는 Mozilla의 DoctorJS (이전 jsctags )를 사용하여 태그 목록을 추가하는 매우 깔끔한 방법이 있습니다 .

  1. 자주 사용하는 패키지 관리자 (Ubuntu 's apt-get, Mac 's homebrew 등)를 사용하여 다음 패키지를 설치하십시오 .
    1. exuberant-ctags
      • 참고 : 설치 후 OS가 사전 설치되어 있지 않고 ctags실제로 실행 되는지 확인하십시오 . 를 실행하여 찾을 수 있습니다 .exuberant-ctagsctagsctags --version
    2. node (Node.js)
  2. DoctorJSgithub에서 복제 :git clone https://github.com/mozilla/doctorjs.git
  3. DoctorJSdir 안으로 들어가서 make install(또한make 앱도 설치 하지만 이것은 매우 기본적입니다).
    • 플러그인 설치에 몇 가지 버그가 있습니다 make install. 현재 속임수를 쓰지 않습니다. 지금은 bin/대신 repo의 dir을 $ PATH에 추가합니다. 자세한 정보는 DoctorJS의 GitHub 및 발행 페이지 를 참조하십시오.
  4. TagBar Vim 플러그인 설치 ( 참고 : 오래된 유명한 TagList가 아니라 TagBar입니다!).
  5. 이익. :)

새 프로젝트-Tern.js

DoctorJS는 현재 사망했습니다 . tern.js 라는 새로운 유망한 프로젝트가 있습니다 . 현재 초기 베타 버전이며 결국 교체해야합니다.

tern을 엔진으로 사용 하는 프로젝트 ramitos / jsctag 가 있습니다. 그냥 npm install -g태그 바는 자바 스크립트 파일에 자동으로 사용합니다.


5
TagBar +1 (TagList 만 알고 있음)
RobM

9
현재 doctorjs에 지정된 복제 재귀 당신을 필요로 이 버그 , git clone --recursive https://github.com/mozilla/doctorjs.git작업을해야 make install을 다음과
앤디 레이


6
3 단계를 수행하기 전에 doctorjs에 cd하고 다음을 수행하십시오 git submodule init && git submodule update.. 그런 다음 3 단계를 수행하십시오.
glortho

2
양조 명령은 실제로brew install ctags-exuberant
sym3tri

17

snipMate 는 TextMate의 삽입 시스템을 에뮬레이트 하고 기본적으로 유용한 JS 스 니펫을 제공합니다. 직접 추가하는 것은 매우 쉽습니다.

javaScriptLint를 사용하면 jsl 에 대해 코드를 검증 할 수 있습니다 .

또한 다양한 JavaScript 구문 파일을 찾을 수 있습니다 vim.org 을 있습니다. 그것들을 시험 해보고 어느 것이 당신과 당신의 코딩 스타일에 가장 적합한 지보십시오.

기본 전 방향 ( ctrlx-ctrlo )은 저에게 매우 효과적입니다. autoComplPop으로 더 역동적으로 만들 수 있지만 때로는 성 가실 수 있습니다 .

tarek11011의 의견에 대한 답변 :

acp는 기본적으로 JavaScript에서 작동하지 않으므로 조금 조정해야합니다. 다음은 내가 한 일입니다 (더러운 해킹, 여전히 Vim noob입니다).

에서 VIM-autocomplpop / 플러그인 / acp.vim 내가 추가 한 phpjavascript(와 actionscript에) behavs그래서 그렇게 보이는 것을 :

let behavs = {
    \   '*'            : [],
    \   'ruby'         : [],
    \   'python'       : [],
    \   'perl'         : [],
    \   'xml'          : [],
    \   'html'         : [],
    \   'xhtml'        : [],
    \   'css'          : [],
    \   'javascript'   : [],
    \   'actionscript' : [],
    \   'php'          : [],
    \ }

조금 아래에는 다음과 같은 일련의 코드 블록이 있습니다.

"---------------------------------------------------------------------------
call add(behavs.ruby, {
    \   'command' : "\<C-x>\<C-o>",
    \   'meets'   : 'acp#meetsForRubyOmni',
    \   'repeat'  : 0,
    \ })

나는 이것을 복제하고 다음과 같이 약간 편집했습니다.

"---------------------------------------------------------------------------
call add(behavs.javascript, {
    \   'command' : "\<C-x>\<C-o>",
    \   'meets'   : 'acp#meetsForRubyOmni',
    \   'repeat'  : 0,
    \ })

액션 스크립트와 PHP에 대해서도 동일하게 수행했습니다.

당신이 편집 JS / 당신이 할 수있는 HTML 문서 내에서 CSS하려면 다음 Vim의 명령 행에서 설정 피트 = html.css.javascript가 만드는 ctrlx- ctrlo작업 방법에 예상대로 / CSS 블록 JS 블록 및 속성 / 값의 속성 이름. 그러나이 방법에는 단점도 있습니다 (이상한 들여 쓰기…).


멋진 키 스트로크를 어떻게 했습니까?
Maxim Sloyko

1
하하, <kbd> </ kbd>입니다. 브라우저에는 일반적으로이 태그에 대한 기본 스타일이 없습니다. 추가 작업을 수행하기 위해 SO 팀에게 도움이됩니다.
romainl

당신이 romainl하지만이 작업은 HTML 파일 함께 autoComplPop에 문제가 감사에는 JS없고, CSS 및 PHP
타렉 Saied

많은 Vim 플러그인과 마찬가지로 acp는 파일 형식에 매우 민감합니다. 버퍼의 파일 유형이 "html"인 경우 내장 JS / CSS / PHP에 대해 acp 또는 omni complete가 작동하지 않습니다. 그리고 여기에 충분한 편집 옵션 / 방이 아닌 대답을 편집 할 것입니다.
romainl

Rok Garbas & co. snipMate현재 유지 보수 브랜치 를 사용하는 것이 좋습니다 . 함께 넣어.
thisgeek

8

이 플러그인은 유용합니다 : https://github.com/maksimr/vim-jsbeautify . 자바 스크립트에 대한 전체 자동 서식을 제공합니다. 한 번의 키 입력으로 코드가 아름답게 보입니다. 코드 스 니펫을 붙여 넣을 때도 유용 할 수 있습니다. 인기있는 js-beautifier를 사용하며 온라인 응용 프로그램으로도 볼 수 있습니다. 후자는 여기에서 찾을 수 있습니다 : http://jsbeautifier.org/ .


3
js-beautifier 등을 통합하는 vim 용 일반 자동 서식 플러그인을 작성했습니다. 여기를 확인하십시오 : github.com/Chiel92/vim-autoformat
Chiel ten Brinke

예쁘다 – 최고
Alex Shwarc

6

jslints 규칙으로 코드를 확인하고 구문 오류를 제공 하는 하나의 js 특정 vim 플러그인-jslint.vim- https ://github.com/hallettj/jslint.vim 만 사용 합니다.



흠, Windows에는 따라야 할 특정 지침이 있으며 자바 스크립트 인터프리터가 필요합니다. Windows에 설치하려고 시도하지 않았지만 설치 지침이 README의 페이지 아래에 약간 있습니다. 죄송합니다. 더 많은 도움을 드릴 수 없습니다.
스캇

3

들여 쓰기 및 자동 서식을 수정하려면 (Ctrl =) : JavaScript 들여 쓰기

들여 쓰기 너비를 설정하려면 javascript.vim ~ / .vim / ftplugin 디렉토리에 다음 내용을 포함하여 파일을 하십시오 (두 개의 공백 들여 쓰기).

 setl sw=2 sts=2 et

에서 ~/.vimrc:autocmd FileType javascript setlocal sw=2 ts=2 sts=2
JuanPablo
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.