Linter の使い方 [Atom Editor]

Linter

参考：

linter | Atom Packages

steelbrain/linter: A Base Linter with Cow Powers – GitHub

ドキュメント

参考：

Linter Documentation | linter [Official]

使い方

参考：

Atom で css のコーディング間違いチェックをする linter-csslint の使い方 | 超初心者ホームページ作成ナビ！

パッケージ

参考：

AtomLinter

linter-eslint

参考：

linter-eslint | Atom Packages

AtomLinter/linter-eslint: ESLint plugin for Atom Linter – GitHub

linter-shellcheck

参考：

linter-shellcheck | Atom Packages

linter-stylelint

参考：

linter-stylelint | Atom Packages

linter-textlint

参考：

linter-textlint | Atom Packages

linter-rubocop

参考：

linter-rubocop | Atom Packages

yarn global add でインストールした ESLint を使う

yarn global dir コマンドを実行して表示されるパスを Global Node Installation Path の欄に設定する。

$ yarn global dir
/path/to/.config/yarn/global

参考：

[Help]Can not find global eslint installed with yarn · Issue #780 · AtomLinter/linter-eslint – GitHub

Vue 単一コンポーネントファイル (.vue) を処理する

参考：

Support specifying file extensions to lint · Issue #966 · AtomLinter/linter-eslint – GitHub

処理の対象にする拡張子を追加する

参考：

Supporting Custom File Types · Issue #254 · AtomLinter/linter-eslint – GitHub

.js.erb ファイルを処理の対象にする

シェルの初期化ファイルにエイリアスを追加する。

alias eslint="eslint --ext .js,.js.erb"

参考：

Eslinter and .js.erb files | Atom Discussion [Official]

linter-eslint not run on file with extension .js.erb · Issue #854 · AtomLinter/linter-eslint – GitHub

エラー

See console for more info という表示が出た場合は、Developer Tools を開いてコンソールでエラーメッセージを確認する。

メニューから、View -> Developer -> Toggle Developer Tools を選択して、Developer Tools を起動する。もしくは、Mac の場合、Cmd + Shift + I で起動する。

参考：

GitHub 製エディタ Atom は Developer Tools が起動できちゃう | Syntax Error.

[Linter] Error running ESLint · Issue #856 · AtomLinter/linter-eslint – GitHub