1
export interface ImportInfo {
2
  name: string;        // 导出名
3
  as?: string;         // 重命名
4
  from: string;        // 包名
5
}
6

7
export interface Preset {
8
  [key: string]: ImportInfo;
9
}
10

11
export function definePreset(
12
  packageName: string,
13
  exports: string[]
14
): Preset {
15
  const preset: Preset = {};
16
  for (const name of exports) {
17
    preset[name] = { name, from: packageName };
18
  }
19
  return preset;
20
}
21

22
// Vue 预设
23
export const vuePreset = definePreset('vue', [
24
  'ref', 'reactive', 'computed', 'watch', 'watchEffect',
25
  'onMounted', 'onUnmounted', 'onBeforeMount', 'onBeforeUnmount',
26
  'nextTick', 'toRef', 'toRefs', 'unref', 'isRef',
27
  'shallowRef', 'triggerRef', 'customRef',
28
  'provide', 'inject',
29
  'defineComponent', 'defineAsyncComponent',
30
  'h', 'createApp',
31
]);
32

33
// VueRouter 预设
34
export const vueRouterPreset = definePreset('vue-router', [
35
  'useRouter', 'useRoute',
36
  'createRouter', 'createWebHistory', 'createWebHashHistory',
37
  'onBeforeRouteLeave', 'onBeforeRouteUpdate',
38
]);
39

40
// Pinia 预设
41
export const piniaPreset = definePreset('pinia', [
42
  'defineStore', 'storeToRefs',
43
  'createPinia',
44
]);

1
import type { ImportInfo, Preset } from './presets';
2

3
export interface ScanResult {
4
  imports: Map<string, ImportInfo[]>; // from => ImportInfo[]
5
  usedIdentifiers: Set<string>;
6
}
7

8
/**
9
 * 使用正则扫描代码中使用的标识符
10
 * 生产级实现应该用 AST，这里为了简洁用正则
11
 */
12
export function scanCode(
13
  code: string,
14
  presets: Preset[]
15
): ScanResult {
16
  // 合并所有预设
17
  const allImports = new Map<string, ImportInfo>();
18
  for (const preset of presets) {
19
    for (const [key, info] of Object.entries(preset)) {
20
      allImports.set(key, info);
21
    }
22
  }
23

24
  // 提取已有的 import 语句中的标识符
25
  const existingImports = new Set<string>();
26
  const importRegex = /import\s+\{([^}]+)\}\s+from\s+['"][^'"]+['"]/g;
27
  let match;
28
  while ((match = importRegex.exec(code)) !== null) {
29
    const names = match[1].split(',').map(s => s.trim().split(/\s+as\s+/).pop()!.trim());
30
    names.forEach(n => existingImports.add(n));
31
  }
32

33
  // 移除字符串和注释，避免误匹配
34
  const cleanCode = code
35
    .replace(/\/\*[\s\S]*?\*\//g, '')   // 块注释
36
    .replace(/\/\/.*/g, '')              // 行注释
37
    .replace(/'[^']*'/g, '""')          // 单引号字符串
38
    .replace(/"[^"]*"/g, '""')          // 双引号字符串
39
    .replace(/`[^`]*`/g, '""');         // 模板字符串
40

41
  // 扫描使用的标识符
42
  const usedIdentifiers = new Set<string>();
43
  const imports = new Map<string, ImportInfo[]>();
44

45
  for (const [name, info] of allImports) {
46
    if (existingImports.has(name)) continue;
47

48
    // 使用词边界匹配，避免部分匹配
49
    const regex = new RegExp(`\\b${name}\\b`);
50
    if (regex.test(cleanCode)) {
51
      usedIdentifiers.add(name);
52

53
      if (!imports.has(info.from)) {
54
        imports.set(info.from, []);
55
      }
56
      imports.get(info.from)!.push(info);
57
    }
58
  }
59

60
  return { imports, usedIdentifiers };
61
}
62

63
/**
64
 * 生成 import 语句
65
 */
66
export function generateImports(
67
  imports: Map<string, ImportInfo[]>
68
): string {
69
  const lines: string[] = [];
70

71
  for (const [from, infos] of imports) {
72
    const specifiers = infos
73
      .map(info => info.as ? `${info.name} as ${info.as}` : info.name)
74
      .sort()
75
      .join(', ');
76

77
    lines.push(`import { ${specifiers} } from '${from}';`);
78
  }
79

80
  return lines.join('\n');
81
}

1
import type { Preset } from './presets';
2
import { writeFileSync, mkdirSync } from 'fs';
3
import { dirname } from 'path';
4

5
export function generateDts(
6
  presets: Preset[],
7
  filePath: string
8
): void {
9
  const lines: string[] = [
10
    '/* eslint-disable */',
11
    '/* prettier-ignore */',
12
    '// Auto-generated by vite-plugin-auto-import',
13
    '// Do not edit manually',
14
    '',
15
    'export {}',
16
    '',
17
    'declare global {',
18
  ];
19

20
  // 按包分组
21
  const byPackage = new Map<string, string[]>();
22
  for (const preset of presets) {
23
    for (const [name, info] of Object.entries(preset)) {
24
      if (!byPackage.has(info.from)) {
25
        byPackage.set(info.from, []);
26
      }
27
      byPackage.get(info.from)!.push(name);
28
    }
29
  }
30

31
  for (const [pkg, names] of byPackage) {
32
    lines.push(`  // ${pkg}`);
33
    for (const name of names.sort()) {
34
      lines.push(`  const ${name}: typeof import('${pkg}')['${name}']`);
35
    }
36
  }
37

38
  lines.push('}', '');
39

40
  mkdirSync(dirname(filePath), { recursive: true });
41
  writeFileSync(filePath, lines.join('\n'), 'utf-8');
42
}

1
import type { Plugin, ResolvedConfig } from 'vite';
2
import { scanCode, generateImports } from './scanner';
3
import { generateDts } from './dts';
4
import { vuePreset, vueRouterPreset, piniaPreset } from './presets';
5
import type { Preset } from './presets';
6
import { resolve } from 'path';
7

8
export interface AutoImportOptions {
9
  /** 预设列表 */
10
  presets?: ('vue' | 'vue-router' | 'pinia')[];
11
  /** 自定义导入映射 */
12
  imports?: Record<string, string[]>;
13
  /** 生成 dts 文件的路径 */
14
  dts?: string | boolean;
15
  /** 需要处理的文件 */
16
  include?: RegExp[];
17
  /** 排除的文件 */
18
  exclude?: RegExp[];
19
}
20

21
const builtinPresets: Record<string, Preset> = {
22
  'vue': vuePreset,
23
  'vue-router': vueRouterPreset,
24
  'pinia': piniaPreset,
25
};
26

27
export default function autoImport(options: AutoImportOptions = {}): Plugin {
28
  const {
29
    presets: presetNames = ['vue'],
30
    imports = {},
31
    dts = './auto-imports.d.ts',
32
    include = [/\.[jt]sx?$/, /\.vue$/],
33
    exclude = [/node_modules/, /\.d\.ts$/],
34
  } = options;
35

36
  // 解析预设
37
  const presets: Preset[] = [];
38

39
  for (const name of presetNames) {
40
    if (builtinPresets[name]) {
41
      presets.push(builtinPresets[name]);
42
    }
43
  }
44

45
  // 解析自定义导入
46
  if (Object.keys(imports).length > 0) {
47
    const customPreset: Preset = {};
48
    for (const [pkg, names] of Object.entries(imports)) {
49
      for (const name of names) {
50
        customPreset[name] = { name, from: pkg };
51
      }
52
    }
53
    presets.push(customPreset);
54
  }
55

56
  let config: ResolvedConfig;
57

58
  return {
59
    name: 'vite-plugin-auto-import',
60
    enforce: 'pre',
61

62
    configResolved(resolvedConfig) {
63
      config = resolvedConfig;
64

65
      // 生成 .d.ts 文件
66
      if (dts) {
67
        const dtsPath = typeof dts === 'string'
68
          ? resolve(config.root, dts)
69
          : resolve(config.root, 'auto-imports.d.ts');
70

71
        generateDts(presets, dtsPath);
72
        console.log(`[auto-import] Generated ${dtsPath}`);
73
      }
74
    },
75

76
    transform(code, id) {
77
      // 过滤文件
78
      if (exclude.some(re => re.test(id))) return;
79
      if (!include.some(re => re.test(id))) return;
80

81
      // 处理 Vue SFC — 只处理 <script> 部分
82
      let scriptCode = code;
83
      let scriptOffset = 0;
84

85
      if (id.endsWith('.vue')) {
86
        const scriptMatch = code.match(
87
          /<script[^>]*>([\s\S]*?)<\/script>/
88
        );
89
        if (!scriptMatch) return;
90
        scriptCode = scriptMatch[1];
91
        scriptOffset = code.indexOf(scriptCode);
92
      }
93

94
      // 扫描代码
95
      const result = scanCode(scriptCode, presets);
96

97
      if (result.imports.size === 0) return;
98

99
      // 生成 import 语句
100
      const importStatements = generateImports(result.imports);
101

102
      // 注入 import
103
      let newCode: string;
104

105
      if (id.endsWith('.vue')) {
106
        // Vue SFC：在 <script> 标签内部顶部注入
107
        const insertPos = scriptOffset;
108
        newCode =
109
          code.slice(0, insertPos) +
110
          '\n' + importStatements + '\n' +
111
          code.slice(insertPos);
112
      } else {
113
        // 普通 JS/TS：在文件顶部注入（跳过已有的 import）
114
        const lastImportIndex = findLastImportIndex(code);
115
        if (lastImportIndex >= 0) {
116
          newCode =
117
            code.slice(0, lastImportIndex) +
118
            '\n' + importStatements +
119
            code.slice(lastImportIndex);
120
        } else {
121
          newCode = importStatements + '\n' + code;
122
        }
123
      }
124

125
      return {
126
        code: newCode,
127
        map: null, // 生产级应该生成 sourcemap
128
      };
129
    },
130
  };
131
}
132

133
function findLastImportIndex(code: string): number {
134
  const lines = code.split('\n');
135
  let lastImportLine = -1;
136

137
  for (let i = 0; i < lines.length; i++) {
138
    const line = lines[i].trim();
139
    if (line.startsWith('import ')) {
140
      lastImportLine = i;
141
    }
142
  }
143

144
  if (lastImportLine === -1) return -1;
145

146
  let index = 0;
147
  for (let i = 0; i <= lastImportLine; i++) {
148
    index += lines[i].length + 1;
149
  }
150
  return index;
151
}

1
import { defineConfig } from 'vite';
2
import vue from '@vitejs/plugin-vue';
3
import autoImport from './plugins/auto-import';
4

5
export default defineConfig({
6
  plugins: [
7
    autoImport({
8
      presets: ['vue', 'vue-router', 'pinia'],
9
      imports: {
10
        'axios': ['axios'],
11
        '@vueuse/core': ['useStorage', 'useMouse', 'useToggle'],
12
      },
13
      dts: './src/auto-imports.d.ts',
14
    }),
15
    vue(),
16
  ],
17
});