Mac で Vim ベースの JavaScript 開発環境を整える (その 1)
冬休みに入ったので、やろうやろうと思って放置してた、アプリ作りをしようと思い、結局、開発環境を新たに整えるのに時間を割いてて、アプリ作りをしていない今日この頃。
年取るにつれ、色々覚えが悪くなっているので、設定した内容をメモ。
きっかけ: Expo でアプリ開発を試したい
React Native でも手軽にアプリ開発感があったんですが、さらに手軽さが増しそうな、Expo を勉強しようと思い、Node JS の開発環境を、ちゃんとしようと思い立ったのがきっかけ。
Atom + Nuclide を試してましたが、Vim バインディングの完成度に満足できず、やめました。他も、Vim 使ってた便利さに勝るメリットは得られなさそう。
Expo は、expo init
でプロジェクトを作成して expo start
すると QR コードが出てきて、Expo のアプリで QR コードを読み込めば、すぐに iPhone 上でアプリを実行しながら、コード編集、リロードの流れで開発できる感じ。スタンドアロンのアプリとしてパブリッシュも可能。Expo 用の API があるが、ほば React Native の開発的な感じ。ドキュメントも丁寧。
何より XCode、Android Studio を使わなくても、アプリを作れそうな感じが素敵。XCode を使うためには、Mac 一択だった縛りがなくなるの
ただ、現状、バックグラウンドの処理実行など、色々制約があるので注意。ただ、開発は活発そうだから、制約も、時が経てば減っていきそう。
JS の Vim 開発環境は、こちらの記事の内容を試してみることに。
エディタ (Neovim、VimR)
Neovim を使うことに決めた。Neovim は、今では使わなくなった機能を消したり、今まで、ごく限られた人しか Vim のコードを把握できてなかったのを、いろんな人で開発できるようにソースコードをリファクタリングしてる Vim といった感じみたい。また、プラグインを、いろんな言語で作れるみたい。標準で、:terminal
で Vim ないでターミナルエミュレータを開けるのも良さそう。
:terminal
があるので、GUI の Vim を使おうと思い、VimR をインストール。Swift を中心に使ってる OSX 用の Vim GUI で、元は MacVim を使ってたけど、今は、NeoVim を使ってるとのこと。
Neovim のインストール
Homebrew で入れるだけ。
brew install neovim
VimR
ダウンロードして、解凍するだけ。
http://vimr.org/
:terminal の設定
ターミナルエミュレータ操作後は、そのままだと、Esc でコマンドモードに戻れない。戻れるようにするために、~/.config/nvim/init.vim
に、以下を追加 (参考)。
tnoremap <silent> <ESC> <C-\><C-n>
あと、ターミナルエミュレーターでは、行数表示は消したいので、以下を追加 (参考)。
au TermOpen * setlocal nonumber norelativenumber
色変え
MacVim を使ってる時は、そのまま使ってたんですが、せっかく GUI を使うので、少しオシャレ感がでる colorscheme を使うことに。background が dark の時の色が良さそうだったので、SOLARIZED を使うことにしました。以下の画像は、SOLARIZED の GitHub より拝借。
ただ、そのまま altercation/vim-colors-solarized を使うと Neovim では動かないので、注意が必要。
frankier/neovim-colors-solarized-truecolor-only を使えば大丈夫。詳細は、こちらに書いてる。
vim-plug
Medium の記事に沿って、vim-plug をインストール。インストールは、curl
でレポジトリのデータを落としてくるだけで簡単。
プラグインのインストールは、init.vim に、いれたいプラグインの GitHub のレポジトリ名を書いて、:PulgInstall
するだけ。チュートリアルは、こちら。
call plug#begin()
Plug 'w0rp/ale'
call plug#end()
init.vim
とりあえず設定した init.vim。プラグインは、設定途中。
set incsearch
set hlsearch
set ts=4
set et
syntax enable
set termguicolors
set background=dark
colorscheme solarized
set backspace=indent,eol,start
set clipboard+=unnamedplus
set number
set encoding=utf-8
set fencs=utf-8,iso-2022-jp,sjis,euc-jp
au TermOpen * setlocal nonumber norelativenumber
tnoremap <silent> <ESC> <C-\><C-n>
call plug#begin()
Plug 'w0rp/ale'
call plug#end()
やりのこし
JS 開発用の、プラグインの設定。
Author And Source
この問題について(Mac で Vim ベースの JavaScript 開発環境を整える (その 1)), 我々は、より多くの情報をここで見つけました https://qiita.com/polikeiji/items/b3845271a93f5304d119著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .