fix: auto generated eslint config file, close unplugin#69 (unplugin#108)

Co-authored-by: Anthony Fu <[email protected]>

.gitignore

@@ -80,3 +80,4 @@ dist
 # IDE
 .idea
 auto-imports.d.ts
+.eslintrc-auto-import.json

README.md

@@ -207,6 +207,14 @@ AutoImport({
     }
   ],
 
+  // Generate corresponding .eslintrc-auto-import.json file.
+  // eslint globals Docs - https://eslint.org/docs/user-guide/configuring/language-options#specifying-globals
+  eslintrc: {
+    enabled: false, // Default `false`
+    filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
+    globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
+  },
+
   // custom resolvers
   // see https://github.com/antfu/unplugin-auto-import/pull/23/
   resolvers: [
@@ -221,6 +229,29 @@ Refer to the [type definitions](./src/types.ts) for more options.
 
 See [src/presets](./src/presets).
 
+## ESLint - eslint(no-undef)
+
+Configure `options.eslintrc`, and modify your eslint configuration file.
+
+Example:
+
+```ts
+// .eslintrc.js
+
+module.exports = { 
+  /* ... */
+  extends: [
+    // ...
+    './.eslintrc-auto-import.json',
+  ],
+}
+
+```
+
+ESLint Docs: [Extending Configuration Files](https://eslint.org/docs/user-guide/configuring/configuration-files#extending-configuration-files)
+
+> Note: `.eslintrc-auto-import.json` is generated automatically, If the configuration file changes do not take effect in time, please check the configuration file, restart eslint server or the editor
+
 ## FAQ
 
 ### Compare to [`vue-global-api`](https://github.com/antfu/vue-global-api)

src/core/eslintrc.ts

@@ -0,0 +1,24 @@
+import type { ESLintGlobalsPropValue, ESLintrc, ImportsFlatMap } from '../types'
+
+interface ESLintConfigs {
+  globals: Record<string, ESLintGlobalsPropValue>
+}
+
+// const __comment__ = 'Generated by `unplugin-auto-import`'
+
+export function generateESLintConfigs(
+  imports: ImportsFlatMap,
+  resolvedImports: ImportsFlatMap = {},
+  eslintrc: ESLintrc,
+) {
+  const eslintConfigs: ESLintConfigs = { globals: {} };
+
+  [
+    ...Object.entries(imports),
+    ...Object.entries(resolvedImports),
+  ]
+    .sort((a, b) => a[0].localeCompare(b[0]))
+    .forEach(([name]) => { eslintConfigs.globals[name] = eslintrc.globalsPropValue || true })
+  const jsonBody = JSON.stringify(eslintConfigs, null, 2)
+  return jsonBody
+}

src/core/options.ts

@@ -3,7 +3,7 @@ import { toArray } from '@antfu/utils'
 import { createFilter } from '@rollup/pluginutils'
 import { isPackageExists } from 'local-pkg'
 import { presets } from '../presets'
-import type { ImportsFlatMap, Options, ResolvedOptions, ResolvedResult } from '../types'
+import type { ESLintrc, ImportsFlatMap, Options, ResolvedOptions, ResolvedResult } from '../types'
 
 export function resolveOptions(options: Options = {}, root = process.cwd()): ResolvedOptions {
   const imports = flattenImportsMap(options.imports, options.presetOverriding)
@@ -12,6 +12,11 @@ export function resolveOptions(options: Options = {}, root = process.cwd()): Res
     dts = isPackageExists('typescript'),
   } = options
 
+  const eslintrc: ESLintrc = options.eslintrc || {}
+  eslintrc.enabled = eslintrc.enabled === undefined ? false : eslintrc.enabled
+  eslintrc.filepath = eslintrc.filepath || './.eslintrc-auto-import.json'
+  eslintrc.globalsPropValue = eslintrc.globalsPropValue === undefined ? true : eslintrc.globalsPropValue
+
   const resolved: ResolvedOptions = {
     sourceMap: false,
     resolvedImports: {},
@@ -29,6 +34,7 @@ export function resolveOptions(options: Options = {}, root = process.cwd()): Res
       options.include || [/\.[jt]sx?$/, /\.vue$/, /\.vue\?vue/, /\.svelte$/],
       options.exclude || [/[\\/]node_modules[\\/]/, /[\\/]\.git[\\/]/],
     ),
+    eslintrc,
   }
 
   return resolved

src/index.ts

@@ -4,17 +4,22 @@ import { throttle } from '@antfu/utils'
 import type { Options } from './types'
 import { resolveOptions } from './core/options'
 import { transform } from './core/transform'
-import { generateDeclaration as _generateDeclaration } from './core/dts'
+import { generateDeclaration } from './core/dts'
+import { generateESLintConfigs } from './core/eslintrc'
 
 export default createUnplugin<Options>((options) => {
   let resolved = resolveOptions(options)
 
   if (!Object.keys(resolved.imports).length && !resolved.resolvers.length)
     console.warn('[auto-import] plugin installed but no imports has defined, see https://github.com/antfu/unplugin-auto-import#configurations for configurations')
 
-  const generateDeclaration = throttle(500, false, () => {
-    if (!resolved.dts) return
-    fs.writeFile(resolved.dts, _generateDeclaration(resolved.imports, resolved.resolvedImports), 'utf-8')
+  const generateConfigFiles = throttle(500, false, () => {
+    if (resolved.dts)
+      fs.writeFile(resolved.dts, generateDeclaration(resolved.imports, resolved.resolvedImports), 'utf-8')
+
+    const { eslintrc } = resolved
+    if (eslintrc.enabled && eslintrc.filepath)
+      fs.writeFile(eslintrc.filepath, generateESLintConfigs(resolved.imports, resolved.resolvedImports, eslintrc), 'utf-8')
   })
 
   return {
@@ -26,13 +31,14 @@ export default createUnplugin<Options>((options) => {
     async transform(code, id) {
       const res = await transform(code, id, resolved)
       if (res && resolved.resolvers.length)
-        generateDeclaration()
+        generateConfigFiles()
+
       return res
     },
     vite: {
       configResolved(config: any) {
         resolved = resolveOptions(options, config.root)
-        generateDeclaration()
+        generateConfigFiles()
       },
     },
   }

src/types.ts

@@ -36,6 +36,25 @@ export type ImportsMap = Record<string, (string | ImportNameAlias)[]>
  */
 export type ImportsFlatMap = Record<string, ResolvedResult>
 
+export type ESLintGlobalsPropValue = boolean | 'readonly' | 'readable' | 'writable' | 'writeable'
+
+export interface ESLintrc {
+  /**
+   * @default false
+   */
+  enabled?: boolean
+  /**
+   * Filepath to save the generated eslint config
+   *
+   * @default './.eslintrc-auto-import.json'
+   */
+  filepath?: string
+  /**
+   * @default true
+   */
+  globalsPropValue?: ESLintGlobalsPropValue
+}
+
 export interface Options {
   /**
    * Preset names or custom imports map
@@ -92,6 +111,11 @@ export interface Options {
    * @default false
    */
   sourceMap?: boolean
+
+  /**
+   * Generate corresponding .eslintrc-auto-import.json file.
+   */
+  eslintrc?: ESLintrc
 }
 
 export interface TransformOptions {
@@ -120,9 +144,10 @@ export interface TransformOptions {
   resolvedImports?: ImportsFlatMap
 }
 
-export interface ResolvedOptions extends Omit<Required<Options>, 'imports' | 'resolvers' | 'dts' | 'include' | 'exclude'>, Required<TransformOptions> {
+export interface ResolvedOptions extends Omit<Required<Options>, 'imports' | 'resolvers' | 'dts' | 'include' | 'exclude' | 'eslintrc'>, Required<TransformOptions> {
   idFilter: (id: string) => boolean
   dts: string | false
+  eslintrc: ESLintrc
 }
 
 export { PresetName }