fix: 🐛 前端模块 和 node 模块分开解析 (#9976)

* fix: 🐛 前端模块 和 node 模块分开解析

* refactor: 🎨 use for loop to try resolvers

Co-authored-by: pshu <pishu.spf@antfin.com>

.prettierignore

@@ -13,3 +13,4 @@ fixtures
 /packages/plugin-docs/client/theme-doc/tailwind.out.css
 .turbo
 /packages/renderer-vue/src/index.ts
+/packages/mfsu/fixtures/resolvesContexts/

package.json

@@ -45,10 +45,10 @@
   },
   "lint-staged": {
     "*.{jsx,less,md,json}": [
-      "prettier --cache --write"
+      "prettier --no-error-on-unmatched-pattern --cache --write"
     ],
     "*.ts?(x)": [
-      "prettier --cache --parser=typescript --write"
+      "prettier --no-error-on-unmatched-pattern --cache --parser=typescript --write"
     ]
   },
   "devDependencies": {

packages/mfsu/src/dep/dep.ts

@@ -1,42 +1,12 @@
 import { pkgUp, winPath, logger, chalk } from '@umijs/utils';
 import assert from 'assert';
-import enhancedResolve from 'enhanced-resolve';
 import { readFileSync } from 'fs';
 import { isAbsolute, join, dirname } from 'path';
 import { MF_VA_PREFIX } from '../constants';
 import { MFSU } from '../mfsu/mfsu';
 import { trimFileContent } from '../utils/trimFileContent';
 import { getExposeFromContent } from './getExposeFromContent';
-
-const resolver = enhancedResolve.create({
-  mainFields: ['module', 'browser', 'main'], // es module first
-  extensions: ['.wasm', '.mjs', '.js', '.jsx', '.ts', '.tsx', '.json'],
-  exportsFields: ['exports'],
-  conditionNames: ['import', 'module', 'require', 'node'],
-  symlinks: false,
-});
-
-async function resolve(context: string, path: string): Promise<string> {
-  return new Promise((resolve, reject) => {
-    resolver(context, path, (err: Error, result: string) =>
-      err ? reject(err) : resolve(result),
-    );
-  });
-}
-
-async function resolveFromContexts(
-  contexts: string[],
-  path: string,
-): Promise<string> {
-  for (const context of contexts) {
-    try {
-      return await resolve(context, path);
-    } catch (e) {
-      // ignore
-    }
-  }
-  throw new Error(`Can't resolve ${path} from ${contexts.join(', ')}`);
-}
+import { resolveFromContexts } from '../utils/resolveUtils';
 
 export class Dep {
   public file: string;

packages/mfsu/src/utils/resolveUtils.test.ts

@@ -0,0 +1,28 @@
+import { join } from 'path';
+import { resolveFromContexts } from './resolveUtils';
+
+const FIXTURE_BASE = join(__dirname, '../../fixtures/resolvesContexts');
+
+test('resolve axios like', async () => {
+  const path = await resolveFromContexts(
+    [join(FIXTURE_BASE, 'axios-like')],
+    'axios',
+  );
+  expect(path).toMatch(/browser-default.js$/);
+});
+
+test('resolve broadcast-channel like', async () => {
+  const path = await resolveFromContexts(
+    [join(FIXTURE_BASE, 'broadcast-channel-like')],
+    'broadcast-channel',
+  );
+  expect(path).toMatch(/browser-index.js$/);
+});
+
+test('resolve broadcast-channel no-exports', async () => {
+  const path = await resolveFromContexts(
+    [join(FIXTURE_BASE, 'broadcast-channel-no-exports')],
+    'broadcast-channel',
+  );
+  expect(path).toMatch(/legacy-browser-index.js$/);
+});

packages/mfsu/src/utils/resolveUtils.ts

@@ -0,0 +1,82 @@
+import enhancedResolve from 'enhanced-resolve';
+
+type Resolver = ReturnType<typeof enhancedResolve.create>;
+
+const ORDERED_MAIN_FIELDS = ['browser', 'module', 'main'];
+const SUPPORTED_EXTS = ['.wasm', '.mjs', '.js', '.jsx', '.ts', '.tsx', '.json'];
+const EXPORTS_FIELDS = ['exports'];
+
+const browserResolver = enhancedResolve.create({
+  mainFields: ORDERED_MAIN_FIELDS,
+  extensions: SUPPORTED_EXTS,
+  exportsFields: EXPORTS_FIELDS,
+  conditionNames: ['browser', 'import'],
+  symlinks: false,
+});
+
+const esmResolver = enhancedResolve.create({
+  mainFields: ORDERED_MAIN_FIELDS,
+  extensions: SUPPORTED_EXTS,
+  exportsFields: EXPORTS_FIELDS,
+  conditionNames: ['module'],
+  symlinks: false,
+});
+
+const cjsResolver = enhancedResolve.create({
+  mainFields: ORDERED_MAIN_FIELDS,
+  extensions: SUPPORTED_EXTS,
+  exportsFields: EXPORTS_FIELDS,
+  conditionNames: ['require', 'node'],
+  symlinks: false,
+});
+
+async function resolveWith(
+  resolver: Resolver,
+  context: string,
+  path: string,
+): Promise<string> {
+  return new Promise((resolve, reject) => {
+    resolver(context, path, (err: Error, result: string) =>
+      err ? reject(err) : resolve(result),
+    );
+  });
+}
+
+async function tryResolvers(rs: Resolver[], context: string, path: string) {
+  let result = '';
+  let lastError: any = null;
+  for (const r of rs) {
+    try {
+      result = await resolveWith(r, context, path);
+      return result;
+    } catch (e) {
+      lastError = e;
+    }
+  }
+  if (!result) {
+    throw lastError || Error(`can't resolve ${path} from ${context}`);
+  }
+  return result;
+}
+
+async function resolve(context: string, path: string): Promise<string> {
+  return await tryResolvers(
+    [browserResolver, esmResolver, cjsResolver],
+    context,
+    path,
+  );
+}
+
+export async function resolveFromContexts(
+  contexts: string[],
+  path: string,
+): Promise<string> {
+  for (const context of contexts) {
+    try {
+      return await resolve(context, path);
+    } catch (e) {
+      // ignore
+    }
+  }
+  throw new Error(`Can't resolve ${path} from ${contexts.join(', ')}`);
+}