跳至主要內容

Vim

Flow 的編輯器整合主要透過 語言伺服器通訊協定 進行。有 許多 vim LSP 程式碼 可供選擇,例如 ALE

ALE

Vim 8+ 和 NeoVim 的非同步程式碼檢查引擎 (ALE) 外掛程式 vim-ale 是一個通用的程式碼檢查引擎,支援 Flow 和許多其他工具。

安裝

依照 ALE README 中的 說明 進行操作。

設定 ALE 使用 flow-language-server 程式碼檢查器,針對 JavaScript 檔案進行檢查

" In ~/.vim/ftplugin/javascript.vim, or somewhere similar.

" Enables only Flow for JavaScript. See :ALEInfo for a list of other available
" linters. NOTE: the `flow` linter uses an old API; prefer `flow-language-server`.
let b:ale_linters = ['flow-language-server']

" Or in ~/.vim/vimrc:
let g:ale_linters = {
\ 'javascript': ['flow-language-server'],
\}

coc.nvim-neovim

Coc 是 vim8 和 neovim 的智能感知引擎。

設定

set nocompatible
filetype off

" install coc.nvim using Plug or preffered plugin manager
call plug#begin('~/.vim/plugged')
Plug 'neoclide/coc.nvim', {'branch': 'release'}
call plug#end()

filetype plugin indent on

" ======= coc settings
set updatetime=300
set shortmess+=c

" Use leader T to show documentation in preview window
nnoremap <leader>t :call <SID>show_documentation()<CR>


function! s:show_documentation()
if (index(['vim','help'], &filetype) >= 0)
execute 'h '.expand('&lt;cword&gt;')
else
call CocAction('doHover')
endif
endfunction

" instead of having ~/.vim/coc-settings.json
let s:LSP_CONFIG = {
\ 'flow': {
\ 'command': exepath('flow'),
\ 'args': ['lsp'],
\ 'filetypes': ['javascript', 'javascriptreact'],
\ 'initializationOptions': {},
\ 'requireRootPattern': 1,
\ 'settings': {},
\ 'rootPatterns': ['.flowconfig']
\ }
\}

let s:languageservers = {}
for [lsp, config] in items(s:LSP_CONFIG)
let s:not_empty_cmd = !empty(get(config, 'command'))
if s:not_empty_cmd | let s:languageservers[lsp] = config | endif
endfor

if !empty(s:languageservers)
call coc#config('languageserver', s:languageservers)
endif

LanguageClient-neovim

在 Vim 中新增 Flow 支援的另一種方式是使用 LanguageClient-neovim

  • 支援 vim 8 和 neovim
  • 將完成項新增至 omnifunc
  • 儲存時檢查 JavaScript 檔案是否有型別錯誤
  • 查看游標下的型別

需求

  • 需要已安裝 Flow,且可於路徑中使用。
  • 需要已使用 flow init 初始化包含 JavaScript 檔案的專案。
  • 需要在 JavaScript 檔案的最上方標記 / @flow /。

Pathogen

cd ~/.vim/bundle
git clone git://github.com/autozimu/LanguageClient-neovim.git

NeoBundle

將此內容新增至 ~/.vimrc

  NeoBundleLazy 'autozimu/LanguageClient-neovim', {
\ 'autoload': {
\ 'filetypes': 'javascript'
\ }}

搭配 Flow 建置步驟,使用 flow-bin

  NeoBundleLazy 'autozimu/LanguageClient-neovim', {
\ 'autoload': {
\ 'filetypes': 'javascript'
\ },
\ 'build': {
\ 'mac': 'npm install -g flow-bin',
\ 'unix': 'npm install -g flow-bin'
\ }}

VimPlug

  Plug 'autozimu/LanguageClient-neovim', {
\ 'branch': 'next',
\ 'do': 'bash install.sh && npm install -g flow-bin',
\ }

設定

let g:LanguageClient_rootMarkers = {
\ 'javascript': ['.flowconfig', 'package.json']
\ }
let g:LanguageClient_serverCommands={
\ 'javascript': ['flow', 'lsp'],
\ 'javascript.jsx': ['flow', 'lsp']
\}

" check the type under cursor w/ leader T
nnoremap <leader>t :call LanguageClient_textDocument_hover()<CR>
nnoremap <leader>y :call LanguageClient_textDocument_definition()<CR>