メインコンテンツまでスキップ

ルールを適用する

デフォルトの挙動​

Markuplintは実行時、設定ファイルを自動で探します。設定ファイルが見つからなかった場合、推奨プリセットのルールを適用します。見つかった場合はその設定に従います。

ルールの設定​

設定ファイルが必要になります。用意できたらrulesプロパティに必要なルールを追加します。

{
  "rules": {
    // ここに追加していく
    "[rule-name]": true,
    "[rule-name2]": "Any Value",
    "[rule-name3]": {
      "value": 12345
    }
  }
}

false以外を値に指定すると、ルールが有効化されます。つまり、falseを指定した場合は無効化されます。値の詳細はrulesプロパティにをご覧ください。

部分的な適用​

構造の一部のみにルールを適用したい場合は、セレクタをnodeRulesまたはchildNodeRulesプロパティに設定します。また、childNodeRulesは対象要素の子要素（inheritanceを設定すれば子孫も含む）に対して適用されます。

{
  "nodeRules": [
    {
      // <main> のみに適用
      "selector": "main",
      "rules": {
        "class-naming": "/[a-z]+(__[a-z]+)?/"
      }
    },
    {
      // 「some-class-name」クラスをもつ要素のみに適用
      "selector": ".some-class-name",
      "rules": {
        "required-attr": true
      }
    }
  ],
  "childNodeRules": [
    {
      // 「ignoreClass」クラスをもつ要素の子要素のみに適用
      "selector": ".ignoreClass",
      "rules": {
        "character-reference": false
      }
    },
    {
      // 「ignoreA11y」クラスをもつ要素の子孫要素のみに適用
      "selector": ".ignoreA11y",
      "inheritance": true,
      "rules": {
        "wai-aria": false
      }
    }
  ]
}

プリセットルールのカスタマイズ​

プリセットは名前付きルールを定義しており、個別にカスタマイズできます。名前付きルールは namespace/rule-name 形式で、無効化、深刻度の変更、名前空間ワイルドカードによる一括無効化が可能です。

{
  "extends": ["markuplint:recommended"],
  "rules": {
    // 特定の名前付きルールを無効化
    "a11y/html-lang": false,

    // 名前付きルールの深刻度を変更
    "a11y/no-autofocus-outside-dialog": "warning",

    // 名前空間内のすべての名前付きルールを無効化
    "a11y/*": false,

    // ベースルール名で無効化（詳細はプロパティリファレンス参照）
    "id-duplication": false
  }
}

複数のプリセットが同じベースルールをラップしている場合（例: a11y/id-duplication と html-standard/id-duplication）、それぞれ独立して実行されます。個別に制御することも可能です。ベースルール名をfalseに設定すると、そのベースルールを含むすべての名前付きルールグループ内で該当ルールが無効化されます — 詳細はベースルール名による無効化を参照してください。

独自の名前付きルールグループをrulesプロパティで定義することもできます。詳細は設定リファレンスを参照してください。

名前付きルールの一覧はプリセット内の名前付きルールを参照してください。

組み込みルール​

各組込みルールの詳細は、「ルール」ページよりご確認ください。

カスタムルールの適用​

もちろん、サードパーティまたはご自身で作成したカスタムルールの適用が可能です。

スラッシュ区切りでプラグイン名とルール名を指定することでカスタムルールが適用されます。

{
  "rules": {
    "[plugin-name]/[rule-name]": true
  }
}

プラグイン名とルール名は以下のように定義されます。

./plugin.js
import { createPlugin, createRule } from '@markuplint/ml-core';

export default createPlugin({
  name: 'my-plugin',
  create(settings) {
    return {
      rules: {
        'my-rule': createRule({
          verify({ report }) {
            // 評価とレポーティングを行う
            report(/* ... */);
          },
        }),
      },
    };
  },
});
{
  "plugins": ["./plugin.js"],
  "rules": {
    "my-plugin/my-rule": true
  }
}