LoginSignup
32
31

More than 5 years have passed since last update.

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

Posted at

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を実行してくる。便利。

32
31
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
32
31