HTML,CSS 작업용 VIM세팅하기

home brew 설치

homebrew는 mac OS용 패키지 관리자이고, 터미널에서 다음 코드로 설치가 가능함

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

설치후에 내 mac에 homebrew가 잘 깔렸나 확인하기 위해 아래 명령어를 입력해 확인

brew doctor

homebrew 설치 끝 (참고 사이트 : https://brew.sh/index_ko.html )

 

vim 8.0 설치

vim --version

버전 확인을 통해 7버전이 깔려있다면 8.2버전으로 업그레이드하기 위해 다음과 같이 실행

brew install mercurial
brew install vim --with-override-system-vim

두번째 줄 이후에 이미 설치되어 있다는 에러가 난다면

brew unlink vim
brew install vim --with-override-system-vim

다시 하란대로 명령어를 입력하고 아래의 명령어로 vim의 버전을 확인했을때 8.~ 이 나오면 성공

vim --version

 

plugin (Vundle) 설치

vim의 플러그인 매니저는 Vundle로 다음과 같이 설치

아래의 명령어를 입력해 Vundle 설치

git clone https://github.com/gmarik/Vundle.vim.git ~/.vim/bundle/Vundle.vim

 

vimrc 세팅

터미널에 아래 명령어를 입력

vim ~/.vimrc

내용( HTML,CSS 작업환경 기준으로 플러그인들을 넣음 )

set nocompatible       " be iMproved, required 
filetype off         " required

set rtp+=~/.vim/bundle/Vundle.vim
call vundle#begin()

Plugin 'VundleVim/Vundle.vim'
Plugin 'tpope/vim-fugitive'
Plugin 'https://github.com/itchyny/lightline.vim'
Plugin 'https://github.com/tpope/vim-surround'
Plugin 'https://github.com/skammer/vim-css-color'
Plugin 'https://github.com/Shutnik/jshint2.vim'
Plugin 'git://git.wincent.com/command-t.git'
Plugin 'rstacruz/sparkup', {'rtp': 'vim/'}
Plugin 'mattn/emmet-vim'
Plugin 'ascenator/L9', {'name': 'newL9'}
Plugin 'scrooloose/nerdtree'
Plugin 'alvan/vim-closetag'

call vundle#end()      " required
filetype plugin indent on  " required

imap <expr> <tab> emmet#expandAbbrIntelligent("<tab>")
set autoindent
set smartindent
set tabstop=2
set shiftwidth=2
set nu
colorscheme default
set backspace=indent,eol,start
syntax enable

위와 같이 작성하고 :w로 저장후 :PluginInstall로 플러그인들을 설치함.

플러그인 종류 및 설명

플러그인 위의 두줄은 다른 플러그인을 사용하기 위한 필수 플러그인

emmet-vim은 html:5 를 입력 후 ctrl y 를 누른 뒤 ,를 누르면 html폼이 완성되는 플러그인 이지만

아래의 imap <expr> <tab> emmet#expandAbbrIntelligent("\<tab>") 로 단축키를 탭키로 바꿔줌.

nerdtree는 디렉토리를 볼수있게 해주는 플러그인이며 :NERDTree로 실행.

vim-closetag는 자동으로 태그를 닫아주는 플러그인

set autoindent " 자동 들여쓰기
set smartindent " 스마트한 들여쓰기

set tabstop=2 "탭 2칸

set shiftwidth=2 " 자동 들여쓰기 2칸
set number " 행번호 표시, set nu 도 가능

colorscheme default " vi 색상 테마 설정
set backspace=eol,start,indent " 줄의 끝, 시작, 들여쓰기에서 백스페이스시 이전줄로
syntax enable " 문법강조 on

끝! 안되시는 부분 댓글로 남겨주세요.