docs: update getting started and examples for 'ts-blank-eslint-parser'

Author: Rel1cx

examples/vite-react-dom-with-ts-blank-eslint-parser-app/eslint.config.js

@@ -3,8 +3,8 @@ import eslintJs from "@eslint/js";
 import eslintReact from "@eslint-react/eslint-plugin";
 import eslintPluginReactHooks from "eslint-plugin-react-hooks";
 import eslintPluginReactRefresh from "eslint-plugin-react-refresh";
-import tsEslintParser from "@typescript-eslint/parser";
 import tsBlankEslintParser from "ts-blank-eslint-parser";
+import tseslint from "typescript-eslint";
 import globals from "globals";
 
 import TSCONFIG from "./tsconfig.json" with { type: "json" };
@@ -70,7 +70,7 @@ export default [
 function getOptimalParser(project = "tsconfig.json") {
   return isFixable()
     ? {
-      parser: tsEslintParser,
+      parser: tseslint.parser,
       parserOptions: {
         project,
         tsconfigRootDir: import.meta.dirname,

examples/vite-react-dom-with-ts-blank-eslint-parser-app/package.json

@@ -23,7 +23,6 @@
     "@tsconfig/strictest": "^2.0.5",
     "@types/react": "^19.0.8",
     "@types/react-dom": "^19.0.3",
-    "@typescript-eslint/parser": "^8.22.0",
     "@vitejs/plugin-react": "^4.3.4",
     "eslint": "^9.19.0",
     "eslint-plugin-react-hooks": "^5.1.0",
@@ -33,6 +32,7 @@
     "ts-blank-eslint-parser": "^0.3.1",
     "ts-blank-space": "^0.5.1",
     "typescript": "^5.7.3",
+    "typescript-eslint": "^8.22.0",
     "vite": "^6.0.11"
   },
   "engines": {

pnpm-lock.yaml

@@ -3,48 +3,88 @@ title: TypeScript with alternative parser
 description: Getting started with TypeScript + TS Blank ESLint Parser setup
 ---
 
-<Callout type="warn">The `ts-blank-eslint-parser` is a work in progress and not support rules that require type information or TypeScript syntax that need transformation like enums, namespaces, decorators. Use it with caution.</Callout>
+<Callout type="warn">
+The `ts-blank-eslint-parser` is a work in progress and comes with limitations:
 
-<Callout type="warn">When using this approach, the auto-fix may not work properly, it is recommended to use https://github.com/chiefmikey/eslint-plugin-disable-autofix to disable any problematic auto-fix without turning off the rule.</Callout>
+- No support for [TypeScript syntax](https://github.com/bloomberg/ts-blank-space/blob/main/docs/unsupported_syntax.md) that need transformation like enums, namespaces, decorators
+- No support for rules that require type information
+- No fixable support for types (the types will also be stripped out in the fix output)
+
+Use it only if you are okay with the limitations.
+
+</Callout>
 
 ## Install
 
 ```sh copy title="Terminal"
 # npm
-npm install --save-dev eslint @eslint/js globals ts-blank-eslint-parser @eslint-react/eslint-plugin
+npm install --save-dev eslint typescript-eslint @eslint/js globals ts-blank-eslint-parser @eslint-react/eslint-plugin
 
 # pnpm
-pnpm add --save-dev eslint @eslint/js globals ts-blank-eslint-parser @eslint-react/eslint-plugin
+pnpm add --save-dev eslint typescript-eslint @eslint/js globals ts-blank-eslint-parser @eslint-react/eslint-plugin
 
 # yarn
-yarn add --dev eslint @eslint/js globals ts-blank-eslint-parser @eslint-react/eslint-plugin
+yarn add --dev eslint typescript-eslint @eslint/js globals ts-blank-eslint-parser @eslint-react/eslint-plugin
 ```
 
 ## Setup
 
 ```js title="eslint.config.js"
+// @ts-check
 import eslintJs from "@eslint/js";
 import eslintReact from "@eslint-react/eslint-plugin";
 import tsBlankEslintParser from "ts-blank-eslint-parser";
+import tseslint from "typescript-eslint";
 import globals from "globals";
 
+import TSCONFIG from "./tsconfig.json" with { type: "json" };
+import TSCONFIG_NODE from "./tsconfig.node.json" with { type: "json" };
+import { isInEditorEnv } from "@eslint-react/shared";
+
+const GLOB_TS = ["**/*.ts", "**/*.tsx"];
+
 export default [
+  // base configuration for browser environment source files
   {
-    files: ["**/*.ts", "**/*.tsx"],
-    ...eslintJs.configs.recommended,
+    files: TSCONFIG.include,
     languageOptions: {
       globals: {
         ...globals.browser,
       },
-      parser: tsBlankEslintParser,
+      ...getOptimalParser(),
     },
-  },
-  {
-    files: ["**/*.ts", "**/*.tsx"],
     rules: {
-      // Put rules you want to override here
-      "@eslint-react/prefer-shorthand-boolean": "warn",
+      ...eslintJs.configs.recommended.rules,
     },
   },
+  // React configuration
+  {
+    files: TSCONFIG.include,
+    ...eslintReact.configs.recommended,
+  },
 ];
+
+function getOptimalParser(project = "tsconfig.json") {
+  return !isFixable()
+    ? {
+      // fast but no fixable support for types
+      parser: tsBlankEslintParser,
+    }
+    : {
+      // slow but needed for fixable to work
+      parser: tseslint.parser,
+      parserOptions: {
+        project,
+        tsconfigRootDir: import.meta.dirname,
+      },
+    };
+}
+
+function isFixable() {
+  return isInEditorEnv() || hasFixFlag();
+}
+
+function hasFixFlag() {
+  return process.argv.includes("--fix");
+}
 ```