コメントでStylelintを無効にする方法

再度有効化するまでエラーを無効化

stylelint-disableと書くと、Stylelintを無効にできる。stylelint-enableで再度有効にするまで、Stylelintのエラーは無視される。

また、stylelint-disableやstylelint-enableのあとにカンマ区切りでルールの名称を指定すると、そのルールだけを有効化/無効化できる。

/* stylelint-disable */

.hoge {} /* この行のエラーは無視される */

.foo {} /* この行のエラーも無視される */

/* stylelint-enable */

/* stylelint-disable rule-1, rule-2 */

.hoge {} /* この行のrule-1とrule-2に関するエラーは無視される */

.foo {} /* この行のrule-1とrule-2に関するエラーも無視される */

/* stylelint-enable rule-1, rule-2*/

特定の行のエラーを無効化

stylelint-disable-lineと書くと、その行のみStylelintを無効にできる。

また、stylelint-disable-lineのあとにカンマ区切りでルールの名称を指定すると、そのルールだけを無効にできる。

/* ``.hoge``のエラーは無視されるが、
 * ``background: red !important;``の行のエラーや``.foo``のエラーは無視されない
 */

.hoge { /* stylelint-disable-line */
    background: red !important;
}

.foo {}

/* .hogeのrule-1に関するエラーを無効化する */

.hoge {} /* stylelint-disable-line rule-1 */

次の行のエラーを無効化

stylelint-disable-next-lineと書くと、そのコメントの次の行のみStylelintを無効にできる。

また、stylelint-disable-next-lineのあとにカンマ区切りでルールの名称を指定すると、そのルールだけを無効にできる。

/* ``background: red !important;``の行のエラーは無視される
 * 他の行のエラーは無視されない
 */

.hoge {
    /* stylelint-disable-next-line */
    background: red !important;
}

/* ``background: red !important;``の行のrule-1に関するエラーは無視される
 * 他の行のエラーは無視されない
 */

.hoge {
    /* stylelint-disable-next-line rule-1 */
    background: red !important;
}

ファイルごと無効化

ファイル丸ごとエラーを無効にしたい場合は、.stylelintignoreファイルを作成し、無効にしたいファイルのパスを指定する。

.stylelintignoreファイルの書式は.gitignoreと同じ。

参考

• Ignoring code | Stylelint