Quantcast
Channel: Vimタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 5608

Node.jsをVimで書く時に設定したことメモ

$
0
0

Node.jsをVimで書く時に設定したことメモ。

NeoBunleのインストール

プラグインはNeoBundleを利用。

NeoBundleによるVimプラグイン管理とおすすめプラグイン

基本的に上記に書いてあるとおり実施

"---------------------------
" Start Neobundle Settings.
"---------------------------
" bundleで管理するディレクトリを指定
set runtimepath+=~/.vim/bundle/neobundle.vim/

" Required:
call neobundle#begin(expand('~/.vim/bundle/'))

" neobundle自体をneobundleで管理
NeoBundleFetch 'Shougo/neobundle.vim'

" 今後このあたりに追加のプラグインをどんどん書いて行きます!!"

call neobundle#end()

" Required:
filetype plugin indent on

" 未インストールのプラグインがある場合、インストールするかどうかを尋ねてくれるようにする設定
" 毎回聞かれると邪魔な場合もあるので、この設定は任意です。
NeoBundleCheck

"-------------------------
" End Neobundle Settings.
"-------------------------

フォルダ移動

NERDTreeプラグインでvim上でフォルダ移動をする

NeoBundle 'scrooloose/nerdtree'

実行

quickrunプラグインでvim上でNode.jsを実行できる

" quickrun
NeoBundle 'thinca/vim-quickrun'
" 水平に分割する
let g:quickrun_config={'*': {'split': ''}}

補完

myhere/vim-nodejs-complete

" complete
NeoBundle 'myhere/vim-nodejs-complete'
autocmd FileType javascript setlocal omnifunc=nodejscomplete#CompleteJS
if !exists('g:neocomplcache_omni_functions')
  let g:neocomplcache_omni_functions = {}
endif
let g:neocomplcache_omni_functions.javascript = 'nodejscomplete#CompleteJS'

let g:node_usejscomplete = 1

ctrl+x,ctrl+oで補完出来る

以下を追加してCtrl+fで補完できるようにする

imap <C-f> <C-x><C-o>

構文解析

Node.js開発環境まとめ

保存の際にeslintを実行するようにする

まずはインストール

$npm install -g eslint

$eslint -h

syntasticでファイル保存時に構文解析する。

NeoBundle 'scrooloose/syntastic'
let g:syntastic_check_on_open=0 "ファイルを開いたときはチェックしない
let g:syntastic_check_on_save=1 "保存時にはチェック
let g:syntastic_check_on_wq = 0 " wqではチェックしない
let g:syntastic_auto_loc_list=1 "エラーがあったら自動でロケーションリストを開く
let g:syntastic_loc_list_height=6 "エラー表示ウィンドウの高さ
set statusline+=%#warningmsg# "エラーメッセージの書式
set statusline+=%{SyntasticStatuslineFlag()}
set statusline+=%*
let g:syntastic_javascript_checkers = ['eslint'] "ESLintを使う
let g:syntastic_mode_map = {
      \ 'mode': 'active',
      \ 'active_filetypes': ['javascript'],
      \ 'passive_filetypes': []
      \ }

これでファイル保存の際に自動でeslintを実行してくる。便利。


Viewing all articles
Browse latest Browse all 5608

Trending Articles