こんにちは、pregum_foxです。
明日は技術書典があるので行ってみようと思ってチケットを見ると13時までは売り切れていました。
行く予定の方は下記からチケットを受け取っておくことをお勧めします。
ちなみにチケット自体は０円です。
はじめに
この記事では、以下のような人間でもVSCodeVimからVSCode Neovimへの移行過程を共有します。
- vscodeにもneovim拡張機能あるんだ、ん、vim-plug なにそれ？美味しいの？
- VSCode Neovim入れたけど動かない〜
- init.vimの中の記述の
Plug ~~ってなに？ - なにもわかんないけど、とりあえず動けばヨシ!
以下目次です。
この記事の対象読者
- VSCodeVim を使用しているが、VSCode Neovim に移行しようと考えている人
- VSCodeVimに慣れてきたが、動作にラグがある為、VSCode Neovimを試してみたいと思っている人
- Neovim使ったことがないけど、vimである程度慣れたので、使ってみたい人
- こちら の記事を見て移行しようとして、surround.vimやeasymotionなどのプラグインがうまく動かなくて萎えたけど頑張って移行したい人
- init.vimやvim-plugという言葉に馴染みはないけどVSCodeVimからVSCode Neovimに移行したい人
この記事を読むと、できるようになること
- vim-plug の使い方がわかるようになる。
- VSCode Neovimを入れて、easymotionやsurround.vimが使えるようになる。
- easymotionやsurround.vimが使える
init.vimの書き方がわかる
この記事の想定していない読者
- VSCodeVimを飛ばして、いきなりVSCode Neovimから触ろうとしている方
- 途中で力尽きてしまう可能性があります。
- VSCodeVimで一通り慣れてからVSCode Neovimへの移行をお勧めします。
- Vimがどういったものかご存知では無い方
動作環境
| 項目 | 内容 |
|---|---|
| Chip | M1 Mac |
| OS | Sonoma 14.1 |
移行手順
0. neovimのインストール
VSCode Neovimは仕組み上内部で動くNeoVimが必要になります。 まずはhomebrewでNeoVimをインストールします。
brew install neovim
後、~/.config/nvim/init.vim ファイルはVSCode Neovimは作ってくれないので、自分で作る必要があります。
下記コマンドでnvimディレクトリの作成とinit.vimファイルの生成を行います。
mkdir -p ~/.config/nvim touch ~/.config/nvim/init.vim
1. Plugのセットアップ
Plugのセットアップは最初の大きなステップでした。vim-plugをインストールし、~/.config/nvim/autoloadディレクトリにplug.vimを設置する必要がありました。これは、以下のコマンドを使用して行いました。
curl -fLo ~/.config/nvim/autoload/plug.vim --create-dirs https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
このステップの完了後、Neovimを起動し、Neovim上で :PlugInstall と入力してコマンドを実行することで、プラグインのインストールが実行されます。ただし、これだけでは十分ではなく、 ~/.config/nvim/init.vim を再読込するか、Neovimを再起動する必要がありました。
2. easymotionの設定
easymotionプラグインは、カーソル移動を容易にするために導入しました。このプラグインの設定には、次のようなマッピングが含まれています。
nmap <Leader>s <Plug>(easymotion-overwin-f)
これにより、
3. 追加の試み
VSCode環境においてinoremap jj
現在使用している init.vim
現在(2023-11-11時点) 私が使用しているでのinit.vimは下記の通りです。
とりあえず、surround.vimとeasymotionが動いているので満足しています。
ほとんど下記記事のinit.vimをお借りしています。
VSCode と NeoVim 拡張機能セットアップについて | プログラマー人生満喫ブログ
if exists('g:vscode')
let g:mapleader = "\<Space>"
nnoremap <leader>a :echo "Heelo"<CR>
" VSCode extension
call plug#begin()
Plug 'tpope/vim-commentary' "コメントプラグイン
Plug 'tomasiser/vim-code-dark' "vimのカラースキーマ
Plug 'leafgarland/typescript-vim' "Typescriptのカラースキーマ
Plug 'rhysd/clever-f.vim'
Plug 'tpope/vim-surround'
" Plug 'kylechui/nvim-surround'
Plug 'terryma/vim-expand-region'
Plug 'asvetliakov/vim-easymotion'
call plug#end()
xmap gc VSCodeCommentary
nmap gc VSCodeCommentary
omap gc VSCodeCommentary
nmap gcc VSCodeCommentaryLine
nnoremap fp call VSCodeNotify('workbench.action.quickOpen')
nnoremap fgs call VSCodeNotify('workbench.view.scm')
inoremap jj <Esc>
nnoremap <Leader>l $
nnoremap <Leader>h ^
nnoremap <Leader>j <C-d>
nnoremap <Leader>l <C-u>
nmap <Leader>w <Plug>(easymotion-overwin-w)
nmap <Leader>s <Plug>(easymotion-overwin-f)
" map v (expand_region_expand)
" map (expand_region_shrink)
set clipboard=unnamed,unnamedplus
else
let mapleader="\<Space>"
call plug#begin()
Plug 'junegunn/fzf.vim'
Plug 'junegunn/fzf', { 'do': { -> fzf#install() } }
Plug 'neoclide/coc.nvim', { 'branch': 'release' }
Plug 'tpope/vim-fugitive'
Plug 'tpope/vim-commentary' "コメントプラグイン
" Plug 'kylechui/nvim-surround'
Plug 'tpope/vim-surround'
Plug 'tomasiser/vim-code-dark' "vimのカラースキーマ
Plug 'lambdalisue/fern.vim' "ファイラー
Plug 'lambdalisue/fern-git-status.vim' "ファイルツリーにgit差分表示
Plug 'lambdalisue/fern-renderer-nerdfont.vim' "ファイラーのアイコン用2
Plug 'easymotion/vim-easymotion' " カーソル移動用
call plug#end()
" tab関連
set autoindent
set tabstop=4
set shiftwidth=4
set expandtab
set number
nmap <Leader>w <Plug>(easymotion-overwin-w)
nmap <Leader>s <Plug>(easymotion-overwin-f)
inoremap jj <Esc>
nnoremap <Leader>l $
nnoremap <Leader>h ^
nnoremap <Leader>j <C-d>
nnoremap <Leader>l <C-u>
let g:EasyMotion_do_mapping = 0
let g:EasyMotion_smartcase = 1
endif
まとめ
この記事では、Pluginを初めて使用する過程での学びと、vscode-vimからvscode-nvimへの移行経験を共有しました。この移行は、新しいツールへの適応と、技術的な課題の克服という点で非常に有益な経験でした。今後も、このような技術的な冒険を通じて、さらなる知識とスキルを身につけていきたいと思います。
ちなみに1. Plugのセットアップ からまとめの上記の文までGPTsで作った推敲用botくんに考えてもらいました。(私はmarkdown形式にするために整えたりしました。)
ここまで読んでいただきありがとうございました。
参考URL
