@antfu/eslint-config 2.1.1 → 2.2.0

package/README.md

@@ -8,9 +8,10 @@
 - Lints also for json, yaml, markdown
 - Sorted imports, dangling commas
 - Reasonable defaults, best practices, only one-line of config
-- Respects `.gitignore` by default
+- Opinionated, but [very customizable](#customization)
 - [ESLint Flat config](https://eslint.org/docs/latest/use/configure/configuration-files-new), compose easily!
 - Using [ESLint Stylistic](https://github.com/eslint-stylistic/eslint-stylistic)
+- Respects `.gitignore` by default
 - **Style principle**: Minimal for reading, stable for diff, consistent
 
 > [!IMPORTANT]
@@ -32,7 +33,7 @@ With [`"type": "module"`](https://nodejs.org/api/packages.html#type) in `package
 // eslint.config.js
 import antfu from '@antfu/eslint-config'
 
-export default await antfu()
+export default antfu()
 ```
 
 With CJS:
@@ -155,7 +156,7 @@ Normally you only need to import the `antfu` preset:
 // eslint.config.js
 import antfu from '@antfu/eslint-config'
 
-export default await antfu()
+export default antfu()
 ```
 
 And that's it! Or you can configure each integration individually, for example:
@@ -164,7 +165,7 @@ And that's it! Or you can configure each integration individually, for example:
 // eslint.config.js
 import antfu from '@antfu/eslint-config'
 
-export default await antfu({
+export default antfu({
   // Enable stylistic formatting rules
   // stylistic: true,
 
@@ -196,7 +197,7 @@ The `antfu` factory function also accepts any number of arbitrary custom config
 // eslint.config.js
 import antfu from '@antfu/eslint-config'
 
-export default await antfu(
+export default antfu(
   {
     // Configures for antfu's config
   },
@@ -241,7 +242,7 @@ import {
   yaml,
 } from '@antfu/eslint-config'
 
-export default await combine(
+export default combine(
   ignores(),
   javascript(/* Options */),
   comments(),
@@ -294,7 +295,7 @@ Certain rules would only be enabled in specific files, for example, `ts/*` rules
 // eslint.config.js
 import antfu from '@antfu/eslint-config'
 
-export default await antfu(
+export default antfu(
   { vue: true, typescript: true },
   {
     // Remember to specify the file glob here, otherwise it might cause the vue plugin to handle non-vue files
@@ -336,9 +337,36 @@ export default antfu({
 
 We provide some optional configs for specific use cases, that we don't include their dependencies by default.
 
+#### Prettier
+
+ESLint is mainly forced on JavaScript. It can support other languages with custom parsers, but that requires a lot of effort to rule parsers and rules to build ecosystems around them. For example, ESLint does not handle CSS and HTML at this moment. It has been a shame for a long time. But since Prettier supports wider range of languages, why don't we use Prettier for them?
+
+> [!WARNING]
+> This is experiemental :)
+
+To enable Prettier support, you need to explicitly turn it on and specify the languages you want to handle:
+
+```js
+// eslint.config.js
+import antfu from '@antfu/eslint-config'
+
+export default antfu({
+  prettier: {
+    css: true, // Let Prettier handles CSS, LESS, SCSS, etc
+    html: true, // Let Prettier handles HTML
+  }
+})
+```
+
+Running `npx eslint` should prompt you to install the required dependencies, otherwise, you can install them manually:
+
+```bash
+npm i -D eslint-plugin-prettier prettier
+```
+
 #### React
 
-To enable React support, need to explicitly turn it on:
+To enable React support  you need to explicitly turn it on:
 
 ```js
 // eslint.config.js
@@ -357,7 +385,7 @@ npm i -D eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-react-refre
 
 #### UnoCSS
 
-To enable UnoCSS support, need to explicitly turn it on:
+To enable UnoCSS support, you need to explicitly turn it on:
 
 ```js
 // eslint.config.js
@@ -432,6 +460,16 @@ and then
 npm i -D lint-staged simple-git-hooks
 ```
 
+## View what rules are enabled
+
+I built a visual tool to help you view what rules are enabled in your project and apply them to what files, [eslint-flat-config-viewer](https://github.com/antfu/eslint-flat-config-viewer)
+
+Go to your project root that contains `eslint.config.js` and run:
+
+```bash
+npx eslint-flat-config-viewer
+```
+
 ## Versioning Policy
 
 This project follows [Semantic Versioning](https://semver.org/) for releases. However, since this is just a config and involves opinions and many moving parts, we don't treat rules changes as breaking changes.
@@ -465,9 +503,15 @@ If you enjoy this code style, and would like to mention it in your project, here
 
 [Why I don't use Prettier](https://antfu.me/posts/why-not-prettier)
 
-### How to lint CSS?
+Well, on the other hand, you can [use still Prettier to handle CSS and HTML formatting](#prettier), which is not yet supported by ESLint.
+
+### How to format CSS?
+
+~~This config does NOT lint CSS. I personally use [UnoCSS](https://github.com/unocss/unocss) so I don't write CSS.~~
+
+Yes, we do now! See [Prettier](#prettier) section for more details.
 
-This config does NOT lint CSS. I personally use [UnoCSS](https://github.com/unocss/unocss) so I don't write CSS. If you still prefer CSS, you can use [stylelint](https://stylelint.io/) for CSS linting.
+For better linting, we recommend trying [stylelint](https://stylelint.io/).
 
 ### I prefer XXX...
 

package/dist/cli.cjs

@@ -46,14 +46,15 @@ var import_parse_gitignore = __toESM(require("parse-gitignore"), 1);
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "2.1.1";
+var version = "2.2.0";
 var devDependencies = {
   "@antfu/eslint-config": "workspace:*",
-  "@antfu/ni": "^0.21.10",
-  "@stylistic/eslint-plugin-migrate": "^1.4.0",
-  "@types/eslint": "^8.44.7",
+  "@antfu/eslint-plugin-prettier": "^5.0.1-1",
+  "@antfu/ni": "^0.21.12",
+  "@stylistic/eslint-plugin-migrate": "^1.4.1",
+  "@types/eslint": "^8.44.8",
   "@types/fs-extra": "^11.0.4",
-  "@types/node": "^20.9.4",
+  "@types/node": "^20.10.1",
   "@types/prompts": "^2.4.9",
   "@types/yargs": "^17.0.32",
   "@unocss/eslint-plugin": "^0.57.7",
@@ -66,7 +67,7 @@ var devDependencies = {
   esno: "^4.0.0",
   execa: "^8.0.1",
   "fast-glob": "^3.3.2",
-  "fs-extra": "^11.1.1",
+  "fs-extra": "^11.2.0",
   "lint-staged": "^15.1.0",
   rimraf: "^5.0.5",
   "simple-git-hooks": "^2.9.0",
@@ -141,7 +142,7 @@ async function run(options = {}) {
   const cwd = import_node_process.default.cwd();
   const pathFlatConfig = import_node_path.default.join(cwd, "eslint.config.js");
   const pathPackageJSON = import_node_path.default.join(cwd, "package.json");
-  const pathESLintIngore = import_node_path.default.join(cwd, ".eslintignore");
+  const pathESLintIgnore = import_node_path.default.join(cwd, ".eslintignore");
   if (import_node_fs.default.existsSync(pathFlatConfig)) {
     console.log(import_picocolors2.default.yellow(`${WARN} eslint.config.js already exists, migration wizard exited.`));
     return;
@@ -158,9 +159,9 @@ async function run(options = {}) {
   await import_promises.default.writeFile(pathPackageJSON, JSON.stringify(pkg, null, 2));
   console.log(import_picocolors2.default.green(`${CHECK} changes wrote to package.json`));
   const eslintIgnores = [];
-  if (import_node_fs.default.existsSync(pathESLintIngore)) {
+  if (import_node_fs.default.existsSync(pathESLintIgnore)) {
     console.log(import_picocolors2.default.cyan(`${ARROW} migrating existing .eslintignore`));
-    const content = await import_promises.default.readFile(pathESLintIngore, "utf-8");
+    const content = await import_promises.default.readFile(pathESLintIgnore, "utf-8");
     const parsed = (0, import_parse_gitignore.default)(content);
     const globs = parsed.globs();
     for (const glob of globs) {

package/dist/cli.js

@@ -17,14 +17,15 @@ import parse from "parse-gitignore";
 import c from "picocolors";
 
 // package.json
-var version = "2.1.1";
+var version = "2.2.0";
 var devDependencies = {
   "@antfu/eslint-config": "workspace:*",
-  "@antfu/ni": "^0.21.10",
-  "@stylistic/eslint-plugin-migrate": "^1.4.0",
-  "@types/eslint": "^8.44.7",
+  "@antfu/eslint-plugin-prettier": "^5.0.1-1",
+  "@antfu/ni": "^0.21.12",
+  "@stylistic/eslint-plugin-migrate": "^1.4.1",
+  "@types/eslint": "^8.44.8",
   "@types/fs-extra": "^11.0.4",
-  "@types/node": "^20.9.4",
+  "@types/node": "^20.10.1",
   "@types/prompts": "^2.4.9",
   "@types/yargs": "^17.0.32",
   "@unocss/eslint-plugin": "^0.57.7",
@@ -37,7 +38,7 @@ var devDependencies = {
   esno: "^4.0.0",
   execa: "^8.0.1",
   "fast-glob": "^3.3.2",
-  "fs-extra": "^11.1.1",
+  "fs-extra": "^11.2.0",
   "lint-staged": "^15.1.0",
   rimraf: "^5.0.5",
   "simple-git-hooks": "^2.9.0",
@@ -112,7 +113,7 @@ async function run(options = {}) {
   const cwd = process.cwd();
   const pathFlatConfig = path.join(cwd, "eslint.config.js");
   const pathPackageJSON = path.join(cwd, "package.json");
-  const pathESLintIngore = path.join(cwd, ".eslintignore");
+  const pathESLintIgnore = path.join(cwd, ".eslintignore");
   if (fs.existsSync(pathFlatConfig)) {
     console.log(c2.yellow(`${WARN} eslint.config.js already exists, migration wizard exited.`));
     return;
@@ -129,9 +130,9 @@ async function run(options = {}) {
   await fsp.writeFile(pathPackageJSON, JSON.stringify(pkg, null, 2));
   console.log(c2.green(`${CHECK} changes wrote to package.json`));
   const eslintIgnores = [];
-  if (fs.existsSync(pathESLintIngore)) {
+  if (fs.existsSync(pathESLintIgnore)) {
     console.log(c2.cyan(`${ARROW} migrating existing .eslintignore`));
-    const content = await fsp.readFile(pathESLintIngore, "utf-8");
+    const content = await fsp.readFile(pathESLintIgnore, "utf-8");
     const parsed = parse(content);
     const globs = parsed.globs();
     for (const glob of globs) {