turn off unicorn/template-indent

README.md

@@ -648,6 +648,53 @@ Prettier:
 }
 ```
 
+### [unicorn/template-indent]
+
+**This rule can be used with certain options.**
+
+This rule will automatically fix the indentation of multiline string templates, to keep them in alignment with the code they are found in. A configurable whitelist is used to ensure no whitespace-sensitive strings are edited.
+
+Prettier deals with:
+
+- html
+- css
+- graphql
+- markdown
+
+Using various tags, functions and comments.
+
+`template-indent` by default formats some of the same tagged templates, which causes conflicts.
+
+If you like this rule, it can be used just fine with Prettier as long as you configure the rule to not deal with the same templates as Prettier.
+
+Example ESLint configuration:
+
+<!-- prettier-ignore -->
+```json
+{
+  "rules": {
+    "unicorn/template-indent": [
+      "error",
+      {
+        "tags": [
+          "outdent",
+          "dedent",
+          "sql"
+        ],
+        "functions": [
+          "dedent",
+          "stripIndent"
+        ],
+        "selectors": [],
+        "comments": [
+          "indent"
+        ]
+      }
+    ]
+  }
+}
+```
+
 ### [vue/html-self-closing]
 
 **This rule requires certain options.**
@@ -825,5 +872,6 @@ When you’re done, run `npm test` to verify that you got it all right. It runs
 [quotes]: https://eslint.org/docs/rules/quotes
 [singlequote]: https://prettier.io/docs/en/options.html#quotes
 [string formatting rules]: https://prettier.io/docs/en/rationale.html#strings
+[unicorn/template-indent]: https://github.com/sindresorhus/eslint-plugin-unicorn/blob/main/docs/rules/template-indent.md
 [vue/html-self-closing]: https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/html-self-closing.md
 [vue/max-len]: https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/max-len.md

bin/validators.js

@@ -48,6 +48,28 @@ module.exports = {
     return Boolean(firstOption && firstOption.allowIndentationTabs);
   },
 
+  "unicorn/template-indent"({ options }) {
+    if (options.length === 0) {
+      return false;
+    }
+
+    const firstOption = options[0];
+
+    if (!firstOption) {
+      return false;
+    }
+
+    const tags = firstOption.tags || [];
+    const comments = firstOption.comments || [];
+
+    return (
+      (tags.includes("html") ||
+        tags.includes("css") ||
+        tags.includes("gql") ||
+        comments.includes("HTML")) === false
+    );
+  },
+
   "vue/html-self-closing"({ options }) {
     if (options.length === 0) {
       return false;

index.js

@@ -18,6 +18,7 @@ module.exports = {
     "@typescript-eslint/lines-around-comment": 0,
     "@typescript-eslint/quotes": 0,
     "babel/quotes": 0,
+    "unicorn/template-indent": 0,
     "vue/html-self-closing": 0,
     "vue/max-len": 0,
 

test/validators.test.js

@@ -65,6 +65,41 @@ rule("no-tabs", {
   invalid: [[], [null], [{ allowIndentationTabs: false }], [{ other: true }]],
 });
 
+rule("unicorn/template-indent", {
+  valid: [
+    [
+      {
+        tags: ["outdent", "dedent", "sql"],
+        functions: ["dedent", "stripIndent"],
+        selectors: [],
+        comments: ["indent"],
+      },
+    ],
+    [
+      {
+        comments: ["indent"],
+      },
+    ],
+  ],
+  invalid: [
+    [
+      {
+        tags: ["outdent", "dedent", "gql", "sql", "html", "styled"],
+      },
+    ],
+    [
+      {
+        tags: ["html", "styled"],
+      },
+    ],
+    [
+      {
+        tags: ["gql"],
+      },
+    ],
+  ],
+});
+
 rule("vue/html-self-closing", {
   valid: [
     [{ html: { void: "any" } }],