Vim の Syntastic で sass-lint が上手く動かないときの debug の話

この記事は書かれてから1年以上が経過しており、最新の情報とは異なる可能性があります

一瞬はまったのでメモしておきます。

~/.sass-lint.yml はホームディレクトリ外では無効でした

まず問題の発端はここからです。

僕は今のところ Vim 上で scss ファイルを編集するときに sass-lint を linter として利用しています。

https://github.com/sasstools/sass-lint

.sass-lint.yml が何も設定されていない状態だと、 この中にあるルールの1つである property-sort-order が 初期設定で alphabetical になっているため、 scss ファイル内のプロパティがアルファベット順になっていない行で すべて警告が出ます。

正直、うざいです・・・。

ちなみに .sass-lint.yml のサンプルはこちらです。

https://github.com/sasstools/sass-lint/blob/develop/docs/sass-lint.yml

ルール一覧はこちら。それぞれ Markdown でまとめられてます。

https://github.com/sasstools/sass-lint/tree/develop/docs/rules

これらを参考にして、 lint が走ったときにうざくならないよう、 設定をそれぞれ吟味したうえで ~/.sass-lint.yml を配置しました。

そして、ホームディレクトリのすぐ下にサンプル用 scss ファイルを置き、 実際にルールが有効 / 無効になっているか確認していきました。

これでいい感じになったなーという頃、実際に warning だらけになっていた対象ファイルで、 試しに保存して linter 走らせてみることに。

がっ。

動かない・・・。なぜ・・・。

そう、 ~/.sass-lint.yml はホームディレクトリ外では無効 なのでした。

.sass-lint.yml 内にファイル指定できるオプションもあるのですが、

files:
  include: '**/*.s+(c|a)ss'

これを ‘*.scss’ にしても ‘/**/*.scss’ にしてもなんともなりません。

さてどうしたものか・・・。

そこで少し考え方を変えて、 lint を走らせる側の設定を見直すことに。

Vim の Syntastic はとても便利

まず現状利用している Syntastic について先にメモしておきます。

Vim で validation, lint を行うとなった場合に、 主要な選択肢の1つになっていると思いますが、 ファイルタイプに応じて様々な checker を指定できるようになっていて、 とても使いやすい syntax checker です。

https://github.com/vim-syntastic/syntastic

まずは自分の使っているプラグインマネージャなどでインストールして、 :h syntastic を読むと良いと思います。

今回の話に沿った部分ですが、 scss のファイルタイプの設定になるので、 ftplugin/scss.vim 内に以下の設定を元々入れてあります。

let g:syntastic_scss_checkers = ['sass_lint']

これもヘルプに全部ある話ですが、

**syntastic_<filetype>_checkers** という名前で指定してやると、 filetype ごとの設定が可能です。

ここではファイルタイプが scss なので、 syntastic_scss_checkers という名前になりますね。

さらに、 checker ごとの細かな設定も可能です。

                                   *'syntastic_<filetype>_<checker>_<option>'*
Checkers that use "makeprgBuild()" construct the corresponding command line
like this: >
    let makeprg = self.makeprgBuild({
                \ "exe": self.getExec(),
                \ "args": "-a -b -c",
                \ "fname": shellescape(expand("%", 1)),
                \ "post_args": "--more --args",
                \ "tail": "2>/dev/null" })
<
The result is a command line of the form: >
    <exe> <args> <fname> <post_args> <tail>
<
All fields above are optional, and can be overridden by setting global
variables 'g:syntastic_<filetype>_<checker-name>_<option-name>' - even
parameters not specified in the call to "makeprgBuild()". For example to
override the arguments and the tail: >
    let g:syntastic_c_pc_lint_args = "-w5 -Iz:/usr/include/linux"
    let g:syntastic_c_pc_lint_tail = "2>/dev/null"
<

ヘルプにもあるように、 例えば filetype が c で checker が pc_lint 、さらに変更したいオプションが args であれば、 g:syntastic_c_pc_lint_args という名前になります。

g:syntastic_<filetype>_<checker-name>_<option-name> というルールですね。

Vim の Syntastic の debug 方法について

話は戻って sass-lint の設定の話です。

lint の実行時に設定ファイルを指定するようなオプション があれば、 仮にホームディレクトリ外であっても、用意した設定ファイルを読み込んで利用できるはずです。

どれが該当するかというと、先ほどの args オプション がそれです。

また、具体的にどのオプションをつけるべきかは、 sass-lint の CLI の項目を見ると良いです。

https://github.com/sasstools/sass-lint#cli

だいたい予想済みだとは思いますが、 config ファイルなので -c オプションが用意されています。

つまり、記述はこうなるはずです。

let g:syntastic_scss_sass_lint_args = '-c ~/.sass-lint.yml'

さて、これでオプション指定もできたので実行してみます!

・・・。

・・・・・・。

何も出ません。

なぜ何も出なくなったのか調べるために、 ヘルプを色々と読み漁ってみます。

中に syntastic-config-debug なる項目が。

つまりこういう感じです。

let g:syntastic_debug = 1
let g:syntastic_debug_file = "~/syntastic.log"

これを追記したうえで、 自分の用意したオプションの有り無しで差分を見てみることに。

syntastic: 1.261645: (中略)'makeprg': 'sass-lint -c .sass-lint.yml -q -f compact index.scss', 'returns': [0, 1]}
syntastic: 1.448422: (中略)'makeprg': 'sass-lint -v -q -f compact index.scss', 'returns': [0, 1]}

おっと、自らが追加したオプションが増えていることは確認できましたが、 逆に -v オプションが消されてしまっておりますね。

ちなみに sass-lint における -v (verbose) オプションは、 cli ではつけないとレポーティングされない、 とあるので、これは必ずつけないといけません。

つまり、最終的な記述はこうなります。

let g:syntastic_scss_checkers = ['sass_lint']
let g:syntastic_scss_sass_lint_args = '-v -c ~/.sass-lint.yml'

ここまでやって、自分の用意した .sass-lint.yml が読み込まれ、 warning だらけの lint からようやく解放されました。

まとめ

今回もですが、 マニュアルやヘルプをきちんと読むといいことあります。

書いてくれた方のためにもちゃんと読む癖をつけましょう。

この記事は書かれてから1年以上が経過しており、最新の情報とは異なる可能性があります

もし記事内に誤りなどございましたら、 @girigiribauer @girigiribauer.com までご一報いただけると助かります。

Related articles