add debounce to delay check run multiple times in a short time

fi3ework · Feb 6, 2023 · ca388f2 · ca388f2
1 parent f65aa71
commit ca388f2
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 4 deletions.
diff --git a/docs/checkers/eslint.md b/docs/checkers/eslint.md
@@ -37,3 +37,4 @@ Advanced object configuration table of `options.eslint`
 | lintCommand        | `string`                                                                                                   | This value is required | `lintCommand` will be executed at build mode, and will also be used as default config for dev mode when `eslint.dev.eslint` is nullable.                                                                                 |
 | dev.overrideConfig | [`ESLint.Options`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/eslint/index.d.ts) | `undefined`            | **(Only in dev mode)** You can override the options of the translated from `lintCommand`. Config priority: `const eslint = new ESLint({cwd: root, ...translatedOptions, ...pluginConfig.eslint.dev?.overrideConfig, })`. |
 | dev.logLevel       | `('error' \| 'warning')[]`                                                                                 | `['error', 'warning']` | **(Only in dev mode)** Which level of ESLint should be emitted to terminal and overlay in dev mode                                                                                                                       |
+debounceTime | `number` | `undefined` | Avoid repeated formatting files when your editor set lint on save action,and avoid multiple check in a short time |     
diff --git a/docs/checkers/typescript.md b/docs/checkers/typescript.md
@@ -23,3 +23,4 @@ Advanced object configuration table of `options.typescript`.
 | root         | `string`  | [Vite config](https://vitejs.dev/config/#root) `root` | Root path to find tsconfig file                                                                                                                                                                                                 |
 | tsconfigPath | `string`  | `"tsconfig.json"`                                     | Relative tsconfig path to `root`                                                                                                                                                                                                |
 | buildMode    | `boolean` | `false`                                               | Add [`--build`](https://www.typescriptlang.org/docs/handbook/project-references.html) to `tsc` flag, note that `noEmit` does NOT work if `buildMode` is `true` ([#36917](https://github.com/microsoft/TypeScript/issues/36917)) |
+debounceTime | `number` | `undefined` | Avoid multiple inspections in a short time |  
diff --git a/packages/vite-plugin-checker/src/checkers/eslint/main.ts b/packages/vite-plugin-checker/src/checkers/eslint/main.ts
@@ -25,6 +25,7 @@ const manager = new FileDiagnosticManager()
 let createServeAndBuild
 
 import type { CreateDiagnostic } from '../../types'
+import debounce from 'lodash.debounce'
 const createDiagnostic: CreateDiagnostic<'eslint'> = (pluginConfig) => {
   let overlay = true
   let terminal = true
@@ -119,9 +120,21 @@ const createDiagnostic: CreateDiagnostic<'eslint'> = (pluginConfig) => {
         ignored: (path: string) => path.includes('node_modules'),
       })
       watcher.add(files)
-      watcher.on('change', async (filePath) => {
-        handleFileChange(filePath, 'change')
-      })
+      // onchange:create debounce function before useage
+      if (pluginConfig.eslint?.debounceTime) {
+        const debounceHandleFileChange = debounce(
+          handleFileChange,
+          pluginConfig.eslint.debounceTime
+        )
+        watcher.on('change', async (filePath) => {
+          debounceHandleFileChange(filePath, 'change')
+        })
+      } else {
+        watcher.on('change', async (filePath) => {
+          handleFileChange(filePath, 'change')
+        })
+      }
+      // unlink
       watcher.on('unlink', async (filePath) => {
         handleFileChange(filePath, 'unlink')
       })

diff --git a/packages/vite-plugin-checker/src/checkers/typescript/main.ts b/packages/vite-plugin-checker/src/checkers/typescript/main.ts
@@ -1,3 +1,4 @@
+import debounce from 'lodash.debounce'
 import os from 'os'
 import path from 'path'
 import invariant from 'tiny-invariant'
@@ -121,13 +122,21 @@ const createDiagnostic: CreateDiagnostic<'typescript'> = (pluginConfig) => {
 
         ts.createSolutionBuilderWithWatch(host, [configFile], {}).build()
       } else {
+        // onchange:add debounce
+        let debounceReportWatchStatusChanged = reportWatchStatusChanged
+        if (typeof pluginConfig.typescript === 'object' && pluginConfig.typescript?.debounceTime) {
+          debounceReportWatchStatusChanged = debounce(
+            reportWatchStatusChanged,
+            pluginConfig.typescript.debounceTime
+          )
+        }
         const host = ts.createWatchCompilerHost(
           configFile,
           { noEmit: true },
           ts.sys,
           createProgram,
           reportDiagnostic,
-          reportWatchStatusChanged
+          debounceReportWatchStatusChanged
         )
 
         ts.createWatchProgram(host)

diff --git a/packages/vite-plugin-checker/src/types.ts b/packages/vite-plugin-checker/src/types.ts
@@ -19,6 +19,10 @@ interface TsConfigOptions {
    * root path of cwd
    */
   buildMode: boolean
+  /**
+   * tsc will delay running,implement through debounce
+   */
+  debounceTime?: number
 }
 
 /**
@@ -58,6 +62,10 @@ export type EslintConfig =
         /** which level of the diagnostic will be emitted from plugin */
         logLevel: ('error' | 'warning')[]
       }>
+      /**
+       * lintCommand will delay running, work with editor lint on save,implement through debounce
+       */
+      debounceTime?: number
     }
 
 /** Stylelint checker configuration */