feat(plugin-auto-import): auto-import-plugin support vite mode

innocces · Jul 25, 2024 · 6908f1a · 6908f1a
1 parent 0534047
commit 6908f1a
Show file tree

Hide file tree

Showing 4 changed files with 114 additions and 58 deletions.
diff --git a/packages/plugin-auto-import/src/index.ts b/packages/plugin-auto-import/src/index.ts
@@ -1,65 +1,13 @@
-import { chalk } from '@tarojs/helper';
 import { IPluginContext } from '@tarojs/service';
-import { resolve } from 'node:path';
-import { readJSONSync } from 'fs-extra';
 
-import AutoImport from 'unplugin-auto-import/webpack';
-import type { ImportsMap, Options } from 'unplugin-auto-import/types';
+import { modifyWebpackChain } from './modifyWebpackChain';
+import { modifyViteConfig } from './modifyViteConfig';
+import { getPkgPath, metaDataPath } from './shared';
 
-const metaDataPath = 'taro-hooks/metadata.json';
+import type { Options } from 'unplugin-auto-import/types';
 
 export default (ctx: IPluginContext, options?: Options) => {
   if (!getPkgPath(metaDataPath)) return;
-  ctx.modifyWebpackChain(({ chain }) => {
-    console.log(chalk.blue(`✨ auto-import 帮助你更轻松的使用 taro-hooks！`));
-    const defaultDtsPath = resolve(ctx.paths.sourcePath, 'auto-imports.d.ts');
-    const {
-      include = [],
-      imports = [],
-      dts = defaultDtsPath,
-      ...extraOptions
-    } = options ?? {};
-
-    chain.plugin('plugin-auto-import').use(
-      AutoImport({
-        include: [
-          // @ts-ignore
-          ...include,
-          /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
-          /\.vue$/,
-          /\.vue\?vue/, // .vue
-        ],
-        imports: [
-          // @ts-ignore
-          ...imports,
-          autoImportPresets(),
-        ],
-        dts,
-        ...extraOptions,
-      }),
-    );
-  });
+  modifyWebpackChain(ctx, options);
+  modifyViteConfig(ctx, options);
 };
-
-export function autoImportPresets(): ImportsMap {
-  const metadataFilePath = getPkgPath(metaDataPath);
-  const metadata = readJSONSync(metadataFilePath);
-
-  return {
-    'taro-hooks': metadata.functions.flatMap(({ name, alias = [] }) => [
-      name,
-      ...alias,
-    ]),
-  };
-}
-
-export function getPkgPath(pkg: string): string {
-  try {
-    return require.resolve(pkg, {
-      paths: [process.cwd()],
-    });
-  } catch (error) {
-    console.log(chalk.yellow(`找不到 ${pkg}. 请先安装`));
-    process.exit(1);
-  }
-}
diff --git a/packages/plugin-auto-import/src/modifyViteConfig.ts b/packages/plugin-auto-import/src/modifyViteConfig.ts
@@ -0,0 +1,40 @@
+import { chalk } from '@tarojs/helper';
+import { IPluginContext } from '@tarojs/service';
+import { resolve } from 'node:path';
+
+import AutoImport from 'unplugin-auto-import/vite';
+import { autoImportPresets } from './shared';
+
+import type { Options } from 'unplugin-auto-import/types';
+
+export function modifyViteConfig(ctx: IPluginContext, options?: Options) {
+  ctx.modifyViteConfig?.(({ viteConfig }) => {
+    console.log(chalk.blue(`✨ auto-import 帮助你更轻松的使用 taro-hooks！`));
+    const defaultDtsPath = resolve(ctx.paths.sourcePath, 'auto-imports.d.ts');
+    const {
+      include = [],
+      imports = [],
+      dts = defaultDtsPath,
+      ...extraOptions
+    } = options ?? {};
+
+    viteConfig.plugins.push(
+      AutoImport({
+        include: [
+          // @ts-ignore
+          ...include,
+          /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
+          /\.vue$/,
+          /\.vue\?vue/, // .vue
+        ],
+        imports: [
+          // @ts-ignore
+          ...imports,
+          autoImportPresets(),
+        ],
+        dts,
+        ...extraOptions,
+      }),
+    );
+  });
+}
diff --git a/packages/plugin-auto-import/src/modifyWebpackChain.ts b/packages/plugin-auto-import/src/modifyWebpackChain.ts
@@ -0,0 +1,40 @@
+import { chalk } from '@tarojs/helper';
+import { IPluginContext } from '@tarojs/service';
+import { resolve } from 'node:path';
+
+import AutoImport from 'unplugin-auto-import/webpack';
+import { autoImportPresets } from './shared';
+
+import type { Options } from 'unplugin-auto-import/types';
+
+export function modifyWebpackChain(ctx: IPluginContext, options?: Options) {
+  ctx.modifyWebpackChain(({ chain }) => {
+    console.log(chalk.blue(`✨ auto-import 帮助你更轻松的使用 taro-hooks！`));
+    const defaultDtsPath = resolve(ctx.paths.sourcePath, 'auto-imports.d.ts');
+    const {
+      include = [],
+      imports = [],
+      dts = defaultDtsPath,
+      ...extraOptions
+    } = options ?? {};
+
+    chain.plugin('plugin-auto-import').use(
+      AutoImport({
+        include: [
+          // @ts-ignore
+          ...include,
+          /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
+          /\.vue$/,
+          /\.vue\?vue/, // .vue
+        ],
+        imports: [
+          // @ts-ignore
+          ...imports,
+          autoImportPresets(),
+        ],
+        dts,
+        ...extraOptions,
+      }),
+    );
+  });
+}
diff --git a/packages/plugin-auto-import/src/shared.ts b/packages/plugin-auto-import/src/shared.ts
@@ -0,0 +1,28 @@
+import { chalk } from '@tarojs/helper';
+import { readJSONSync } from 'fs-extra';
+import type { ImportsMap } from 'unplugin-auto-import/types';
+
+export const metaDataPath = 'taro-hooks/metadata.json';
+
+export function autoImportPresets(): ImportsMap {
+  const metadataFilePath = getPkgPath(metaDataPath);
+  const metadata = readJSONSync(metadataFilePath);
+
+  return {
+    'taro-hooks': metadata.functions.flatMap(({ name, alias = [] }) => [
+      name,
+      ...alias,
+    ]),
+  };
+}
+
+export function getPkgPath(pkg: string): string {
+  try {
+    return require.resolve(pkg, {
+      paths: [process.cwd()],
+    });
+  } catch (error) {
+    console.log(chalk.yellow(`找不到 ${pkg}. 请先安装`));
+    process.exit(1);
+  }
+}