はじめに
家にPCがないのでスマホ（Android）で開発環境を構築しようと考えました。
動作環境
- Sony Xperia 10 IV
- Android OS 12
- UserLAnd 3.1.4
- Ubuntu 20.04.5 LTS
- Node.js 18.13.0
- Yarn 1.22.19
- Vim 8.1.3741
行数の表示
- number
Vimの左側に行数が表示されるようになります。
~/.vimrc
set number
インデント、タブ幅の設定
- autoindent
改行前のインデントを保持します。
~/.vimrc
"-- 省略 --
set autoindent
- tabstop
Tab入力時の幅を設定します。
~/.vimrc
"-- 省略 --
set tabstop=2
- shiftwidth
インデント増減時の幅を設定します。
~/.vimrc
"-- 省略 --
set shiftwidth=2
- expandtab
Tabをスペースに設定します。
~/.vimrc
"-- 省略 --
set expandtab
文字コード、改行の設定
- encoding
文字コードを設定します。
~/.vimrc
"-- 省略 --
set encoding=utf-8
- fileformat
改行コードを設定します。
~/.vimrc
"-- 省略 --
set fileformat=unix
ステータスラインの表示
- laststatus
Vimの下側にステータスラインが常に表示されるようになります。
~/.vimrc
"-- 省略 --
set laststatus=2
vim-plugをインストール
Vimのプラグインマネージャーをインストールします。
$ curl -k -fLo ~/.vim/autoload/plug.vim --create-dirs https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
インストールするプラグインを~/.vimrcの以下の部分に追記していきます。
~/.vimrc
"-- 省略 --
call plug#begin()
"-- プラグインをここに追記 --
call plug#end()
Yarnをインストール
プラグインの導入で必要になるYarnをインストールします。
$ npm install -g yarn
coc.nvimをインストール
VimをVSCode風の環境にするプラグインです。
~/.vimrc
"-- 省略 --
call plug#begin()
"-- 追記ここから --
Plug 'neoclide/coc.nvim', {'branch': 'release'}
"-- 追記ここまで --
call plug#end()
Vimを再起動してコマンドモードで以下を実行します。
:PlugInstall
Vimの起動時に警告が表示されるので~/.vimrcに以下を追記します。
~/.vimrc
"-- 省略 --
call plug#end()
"-- 追記ここから --
let g:coc_disable_startup_warning = 1
"-- 追記ここまで --
coc-volarをインストール
Nuxt3の開発では有名な拡張機能Volarをインストールします。
~/.vimrc
"-- 省略 --
call plug#begin()
Plug 'neoclide/coc.nvim', {'branch': 'release'}
"-- 追記ここから --
Plug 'yaegassy/coc-volar', {'do': 'yarn install'}
"-- 追記ここまで --
call plug#end()
"-- 省略 --
Vimを再起動してコマンドモードで以下を実行します。
:PlugInstall
lightlineをインストール
Vimのステータスラインを拡張するlightlineをインストールします。
~/.vimrc
"-- 省略 --
call plug#begin()
"-- 追記ここから --
Plug 'itchyny/lightline.vim'
"-- 追記ここまで --
Plug 'neoclide/coc.nvim', {'branch': 'release'}
Plug 'yaegassy/coc-volar', {'do': 'yarn install'}
call plug#end()
"-- 省略 --
Vimを再起動してコマンドモードで以下を実行します。
:PlugInstall
私は以下のような設定で使っています。（全く使いこなせてません。。。）
~/.vimrc
"-- 省略 --
call plug#end()
"-- 追記ここから --
let g:lightline =
\ {
\ 'colorscheme': 'wombat',
\ 'active': {
\ 'left': [
\ [ 'paste' ],
\ [ 'readonly', 'filename', 'modified' ]
\ ],
\ 'right': [
\ [ 'lineinfo' ],
\ [ 'percent' ],
\ [ 'fileformat', 'fileencoding', 'filetype' ]
\ ],
\ }
\ }
"-- 追記ここまで --
"-- 省略 --
let g:coc_disable_startup_warning = 1
nord-vimをインストール
Vimのカラースキームをインストールします。
~/.vimrc
"-- 省略 --
call plug#begin()
"-- 追記ここから --
Plug 'arcticicestudio/nord-vim'
"-- 追記ここまで --
Plug 'itchyny/lightline.vim'
Plug 'neoclide/coc.nvim', {'branch': 'release'}
Plug 'yaegassy/coc-volar', {'do': 'yarn install'}
call plug#end()
"-- 省略 --
Vimを再起動してコマンドモードで以下を実行します。
:PlugInstall
私は以下のような設定で使っています。（全く使いこなせてません。。。）
~/.vimrc
"-- 省略 --
call plug#end()
"-- 追記ここから --
let g:nord_bold_vertical_split_line = 1
let g:nord_italic = 1
let g:nord_italic_comments = 1
colorscheme nord
"-- 追記ここまで --
let g:lightline =
"-- 省略 --
Vimの設定公開
~/.vimrc
set number
set autoindent
set tabstop=2
set shiftwidth=2
set expandtab
set encoding=utf-8
set fileformat=unix
set laststatus=2
call plug#begin()
Plug 'arcticicestudio/nord-vim'
Plug 'itchyny/lightline.vim'
Plug 'neoclide/coc.nvim', {'branch': 'release'}
Plug 'yaegassy/coc-volar', {'do': 'yarn install'}
call plug#end()
let g:nord_bold_vertical_split_line = 1
let g:nord_italic = 1
let g:nord_italic_comments = 1
colorscheme nord
let g:lightline =
\ {
\ 'colorscheme': 'wombat',
\ 'active': {
\ 'left': [
\ [ 'paste' ],
\ [ 'readonly', 'filename', 'modified' ]
\ ],
\ 'right': [
\ [ 'lineinfo' ],
\ [ 'percent' ],
\ [ 'fileformat', 'fileencoding', 'filetype' ]
\ ],
\ }
\ }
let g:coc_disable_startup_warning = 1