From b5933a9888e69168df54a7421faaf895823dbc85 Mon Sep 17 00:00:00 2001
From: Haoqun Jiang <haoqunjiang@gmail.com>
Date: Tue, 21 Feb 2023 18:36:22 +0800
Subject: [PATCH] feat: add a skip-formatting ruleset

---
 README.md          | 31 +++++++++++++++++++++++++++++++
 package.json       |  5 +++--
 skip-formatting.js |  6 ++++++
 3 files changed, 40 insertions(+), 2 deletions(-)
 create mode 100644 skip-formatting.js

diff --git a/README.md b/README.md
index 7779f31..2e177ff 100644
--- a/README.md
+++ b/README.md
@@ -34,6 +34,37 @@ module.exports = {
 }
 ```
 
+This configuration is the most straightward way to use ESLint with Prettier.
+
+It disables all rules that are unnecessary or might conflict with Prettier.
+It also enables the `eslint-plugin-prettier` plugin, which runs Prettier as an ESLint rule and reports differences as individual ESLint issues.
+
+By default all formatting issues are reported as warnings, and will be automatically fixed during `eslint --fix`.
+
+## Use Separate Commands for Linting and Formatting
+
+While the above setup is very straightforward, it is not necessarily the best way.
+
+Running prettier inside the linter slows down the linting process, might clutter the editor with annoying warnings, and adds one layer of indirection where things may break.
+[Prettier's official documentation](https://prettier.io/docs/en/integrating-with-linters.html) recommends using separate commands for linting and formatting, i.e., Prettier for code formatting concerns and ESLint for code-quality concerns.
+
+So we offered an additional ruleset to support this workflow:
+
+```js
+require("@rushstack/eslint-patch/modern-module-resolution")
+
+module.exports = {
+  extends: [
+    // ... other configs
+    "@vue/eslint-config-prettier/skip-formatting"
+  ]
+}
+```
+
+Formatting issues won't be reported with this config.
+
+You can run `prettier --check .` separately to check for formatting issues, or `prettier --write .` to fix them.
+
 ## Further Reading
 
 The default config is based on the recommended configuration of [`eslint-plugin-prettier`](https://github.com/prettier/eslint-plugin-prettier/#recommended-configuration), which also depends on [`eslint-config-prettier`](https://github.com/prettier/eslint-config-prettier). Please refer to their corresponding documentations for more implementation details.
diff --git a/package.json b/package.json
index dd36876..cffba69 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,8 @@
   "description": "eslint-config-prettier for Vue",
   "main": "index.js",
   "files": [
-    "index.js"
+    "index.js",
+    "skip-formatting.js"
   ],
   "publishConfig": {
     "access": "public"
@@ -43,6 +44,6 @@
     ]
   },
   "scripts": {
-    "lint": "eslint index.js --fix"
+    "lint": "eslint *.js --fix"
   }
 }
diff --git a/skip-formatting.js b/skip-formatting.js
new file mode 100644
index 0000000..2eb83ce
--- /dev/null
+++ b/skip-formatting.js
@@ -0,0 +1,6 @@
+module.exports = {
+  extends: [require.resolve("./index.js")],
+  rules: {
+    "prettier/prettier": "off",
+  },
+};