ESLintでコードのチェックをしたいです。
Vimで使用できるように設定したのですが、なぜか使えません。
解決方法を教えてください。
MacBook Air (Apple Silicon）
ESLintをインストールして設定し、Vimの設定もしたのですが、できません。
mkdir myappをしたあと、
npx create-react-app my app
を行いました。
その後、myappディレクトリで、
npm install eslintしました。
その後eslint --initできず、
にを参考にnpx eslint --initにより初期設定を行いました。
その後作った.eslintrc.jsonをいじり、次のようになりました。
{
"env": {
"browser": true,
"es2021": true,
"es6": true
},
"extends": [
"eslint:recommended",
"plugin:react/recommended"
],
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 2019,
"sourceType": "module"
},
"plugins": [
"react"
],
"settings": {
"react"{
"version":"detect"
}
},
"rules": {
"no-undef":"error",
"semi":"warn",
"no-extra-semi":"warn",
"arrow-body-style": "error",
"arrow-parens": "error",
"arrow-spacing": "error",
"generator-star-spacing": "error",
"no-duplicate-imports": "error",
"no-useless-computed-key": "error",
"no-useless-constructor": "error",
"no-useless-rename": "error",
"no-var": "error",
"object-shorthand": "error",
"prefer-arrow-callback": "error",
"prefer-const": "error",
"prefer-rest-params": "error",
"prefer-spread": "error",
"prefer-template": "error",
"rest-spread-spacing": "error",
"template-curly-spacing": "error",
"yield-star-spacing": "error"
}
}
ESLintのバージョンはv7.22.0です。
コードをチェックするために、下記のプラグインを導入しました。
これに関する~/.vimrcはこのようになっています。
call dein#add('vim-syntastic/syntastic')
set statusline+=%#warningmsg#
set statusline+=%{SyntasticStatuslineFlag()}
set statusline+=%*
let g:syntastic_enable_signs = 1
let g:syntastic_always_populate_loc_list = 0
let g:syntastic_auto_loc_list = 0
let g:syntastic_check_on_open = 1
let g:syntastic_check_on_wq = 0
let g:syntastic_mode_map = {'mode':'active','active_filetypes':[
\ 'javascript','html','css','ejavascript','python','vim','zsh']}
let g:syntastic_javascript_checkers = ['eslint']
let g:syntastic_python_checkers= ['flake8']
noremap <C-c> :w<CR>:SyntasticCheck<CR>
上記のように設定しました。
その後一度ターミナルを再起動し、myappディレクトリに次のようなサンプルファイルを作りました。
console.log(hello)
その後、npx eslint a.jsを行うと、次のように実行できました。
/Users/ユーザー名/myapp/a.js
1:13 error 'hello' is not defined no-undef
1:19 warning Missing semicolon semi
✖ 2 problems (1 error, 1 warning)
0 errors and 1 warning potentially fixable with the `--fix` option.
しかし、~/.vimrcの設定では、ファイルを開いた時にエラーがあれば教えてくると思うのですが、何もありません。:SyntasticInfoを行うと、次のようになりました。
Syntastic version: 3.10.0-22(Vim 802, Darwin)
Info for filetype:javascript
Global mode:active
Filetype javascript is active
The current file will be checked automatically
Available checkers: -
Currently enabled checkers: -
Press ENTER or type command to continue
おそらくAvailableとCureentlyの部分が-になっていることが原因だと思うのですが、なぜそうなっているのかがわかりません。
教えていただけると嬉しいです。
ちなみにですが、Pythonでは設定しているflake8はVimで正しく作動しました。
恐らく syntastic は、eslint コマンドが $PATH 上に存在しないと動かないのだと思います。
調べてみたところ、推測が正しければ以下のような設定で動くかもしれません。
let g:syntastic_javascript_eslint_exe = 'npx eslint'
ちなみに、syntastic はかなり古い方のプラグインで、現在だと ALE や vim-lsp + efm-langserver (こちらは少々大掛かりで設定も大変です) などの組み合わせを利用する方法もあります。
@i_rei
Questioner@i_rei
Questioner