@modern-js/plugin-bff 1.0.0 → 1.1.2-beta.0

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # @modern-js/plugin-bff
 
+## 1.1.1
+
+### Patch Changes
+
+- 0fa83663: support more .env files
+- Updated dependencies [6f7fe574]
+- Updated dependencies [b011e0c5]
+- Updated dependencies [0fa83663]
+- Updated dependencies [f594fbc8]
+- Updated dependencies [395beb1e]
+  - @modern-js/core@1.1.2
+  - @modern-js/babel-preset-lib@1.1.1
+  - @modern-js/server-utils@1.1.1
+  - @modern-js/bff-utils@1.1.1
+  - @modern-js/create-request@1.1.1
+  - @modern-js/server-plugin@1.1.1
+  - @modern-js/babel-chain@1.1.1
+  - @modern-js/babel-compiler@1.1.2
+  - @modern-js/utils@1.1.2
+
+## 1.1.0
+
+### Minor Changes
+
+- 96119db2: Relese v1.1.0### Patch Changes
+
+- Updated dependencies [96119db2]
+  - @modern-js/babel-preset-lib@1.1.0
+  - @modern-js/core@1.1.0
+  - @modern-js/bff-utils@1.1.0
+  - @modern-js/create-request@1.1.0
+  - @modern-js/server-plugin@1.1.0
+  - @modern-js/server-utils@1.1.0
+  - @modern-js/babel-chain@1.1.0
+  - @modern-js/babel-compiler@1.1.0
+  - @modern-js/utils@1.1.0
+
 ## 1.0.0
 
 ### Patch Changes

package/README.md

@@ -17,10 +17,7 @@
 
 > The doc site ([modernjs.dev](https://modernjs.dev)) and articles are only available in Chinese for now, we are planning to add English versions soon.
 
-- 介绍 Modern.js (即将上线)
-- [迈入现代 Web 开发](https://zhuanlan.zhihu.com/p/386607009)
-- [现代 Web 开发者问卷调查报告](https://zhuanlan.zhihu.com/p/403206195)
-- [字节跳动是如何落地微前端的](https://mp.weixin.qq.com/s/L9wbfNG5fTXF5bx7dcgj4Q)
+- [Modern.js: Hello, World!](https://zhuanlan.zhihu.com/p/426707646)
 
 ## Getting Started
 

package/dist/js/modern/cli.js

@@ -1,8 +1,9 @@
+import path from 'path';
+import fs from 'fs-extra';
 import { createPlugin, useAppContext, useResolvedConfigContext } from '@modern-js/core';
 import { compiler } from '@modern-js/babel-compiler';
-import { PLUGIN_SCHEMAS, path, fs, upath } from '@modern-js/utils';
+import { PLUGIN_SCHEMAS, normalizeOutputPath, API_DIR } from '@modern-js/utils';
 import { resolveBabelConfig } from '@modern-js/server-utils';
-import { API_DIR } from "./constants";
 const DEFAULT_API_PREFIX = '/api';
 const TS_CONFIG_FILENAME = 'tsconfig.json';
 const FILE_EXTENSIONS = ['.js', '.ts', '.mjs', '.ejs'];
@@ -33,13 +34,14 @@ export default createPlugin(() => ({
           const prefix = (bff === null || bff === void 0 ? void 0 : bff.prefix) || DEFAULT_API_PREFIX;
           const rootDir = path.resolve(appDirectory, API_DIR);
           chain.resolve.alias.set('@api', rootDir);
-          const apiRegexp = new RegExp(`${appDirectory}/api/.*(.[tj]s)$`);
-          chain.module.rule('loaders').oneOf('bff-client').before('fallback').test(apiRegexp).use('custom-loader').loader(upath.normalizeSafe(require.resolve("./loader"))).options({
+          const apiRegexp = new RegExp(normalizeOutputPath(`${appDirectory}${path.sep}api${path.sep}.*(.[tj]s)$`));
+          chain.module.rule('loaders').oneOf('bff-client').before('fallback').test(apiRegexp).use('custom-loader').loader(require.resolve("./loader").replace(/\\/g, '/')).options({
             prefix,
             apiDir: rootDir,
             port,
             fetcher,
-            target: _config.name
+            target: _config.name,
+            requestCreator: bff === null || bff === void 0 ? void 0 : bff.requestCreator
           });
         }
       },

package/dist/js/modern/constants.js

@@ -1,2 +1,2 @@
-export const API_DIR = 'api';
+export const API_APP_NAME = '_app';
 export const BUILD_FILES = ['**/*.[tj]sx?', '!**/*.test.jsx?', '!**/*.test.tsx?', '!**/*.spec.jsx?', '!**/*.spec.tsx?', '!__tests__/*.tsx?', '!__tests__/*.jsx?'];

package/dist/js/modern/loader.js

@@ -9,7 +9,7 @@ async function loader(source) {
 
   const draftOptions = getOptions(this);
   const options = {
-    prefix: draftOptions.prefix,
+    prefix: Array.isArray(draftOptions.prefix) ? draftOptions.prefix[0] : draftOptions.prefix,
     apiDir: draftOptions.apiDir,
     target: draftOptions.target,
     port: Number(draftOptions.port),
@@ -26,6 +26,7 @@ async function loader(source) {
     options.requestCreator = draftOptions.requestCreator;
   }
 
+  options.requireResolve = require.resolve;
   const result = await generateClient(options);
 
   if (result.isOk) {

package/dist/js/modern/server.js

@@ -1,18 +1,73 @@
-import { path } from '@modern-js/utils';
+import path from 'path';
 import { createPlugin } from '@modern-js/server-plugin';
 import { injectAPIHandlerInfos } from '@modern-js/bff-utils';
-import { API_DIR } from "./constants";
-export default createPlugin(() => ({
-  prepareApiServer(props, next) {
-    const {
-      pwd,
-      prefix
-    } = props;
-    const apiDir = path.resolve(pwd, API_DIR);
-    injectAPIHandlerInfos(apiDir, prefix);
-    return next(props);
+import { useAppContext } from '@modern-js/core';
+import { API_DIR, isProd, requireExistModule } from '@modern-js/utils';
+import { API_APP_NAME } from "./constants";
+
+class Storage {
+  constructor() {
+    this.middlewares = [];
+  }
+
+  reset() {
+    this.middlewares = [];
+  }
+
+}
+
+const createTransformAPI = storage => ({
+  addMiddleware(fn) {
+    storage.middlewares.push(fn);
+  }
+
+});
+
+export default createPlugin(() => {
+  const {
+    appDirectory,
+    distDirectory
+  } = useAppContext();
+  const root = isProd() ? distDirectory : appDirectory;
+  const apiPath = path.resolve(root || process.cwd(), API_DIR);
+  const apiAppPath = path.resolve(apiPath, API_APP_NAME);
+  const storage = new Storage();
+  const transformAPI = createTransformAPI(storage);
+  const apiMod = requireExistModule(apiAppPath);
+
+  if (apiMod) {
+    apiMod(transformAPI);
   }
 
-}), {
+  return {
+    reset() {
+      storage.reset();
+      const newApiModule = requireExistModule(apiAppPath);
+
+      if (newApiModule) {
+        newApiModule(transformAPI);
+      }
+    },
+
+    gather({
+      addAPIMiddleware
+    }) {
+      storage.middlewares.forEach(mid => {
+        addAPIMiddleware(mid);
+      });
+    },
+
+    prepareApiServer(props, next) {
+      const {
+        pwd,
+        prefix
+      } = props;
+      const apiDir = path.resolve(pwd, API_DIR);
+      injectAPIHandlerInfos(apiDir, prefix);
+      return next(props);
+    }
+
+  };
+}, {
   name: '@modern-js/plugin-bff'
 });

package/dist/js/node/cli.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _path = _interopRequireDefault(require("path"));
+
+var _fsExtra = _interopRequireDefault(require("fs-extra"));
+
 var _core = require("@modern-js/core");
 
 var _babelCompiler = require("@modern-js/babel-compiler");
@@ -13,7 +17,7 @@ var _utils = require("@modern-js/utils");
 
 var _serverUtils = require("@modern-js/server-utils");
 
-var _constants = require("./constants");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const DEFAULT_API_PREFIX = '/api';
 const TS_CONFIG_FILENAME = 'tsconfig.json';
@@ -45,21 +49,22 @@ var _default = (0, _core.createPlugin)(() => ({
           } = bff || {};
           const prefix = (bff === null || bff === void 0 ? void 0 : bff.prefix) || DEFAULT_API_PREFIX;
 
-          const rootDir = _utils.path.resolve(appDirectory, _constants.API_DIR);
+          const rootDir = _path.default.resolve(appDirectory, _utils.API_DIR);
 
           chain.resolve.alias.set('@api', rootDir);
-          const apiRegexp = new RegExp(`${appDirectory}/api/.*(.[tj]s)$`);
-          chain.module.rule('loaders').oneOf('bff-client').before('fallback').test(apiRegexp).use('custom-loader').loader(_utils.upath.normalizeSafe(require.resolve("./loader"))).options({
+          const apiRegexp = new RegExp((0, _utils.normalizeOutputPath)(`${appDirectory}${_path.default.sep}api${_path.default.sep}.*(.[tj]s)$`));
+          chain.module.rule('loaders').oneOf('bff-client').before('fallback').test(apiRegexp).use('custom-loader').loader(require.resolve("./loader").replace(/\\/g, '/')).options({
             prefix,
             apiDir: rootDir,
             port,
             fetcher,
-            target: _config.name
+            target: _config.name,
+            requestCreator: bff === null || bff === void 0 ? void 0 : bff.requestCreator
           });
         }
       },
       source: {
-        moduleScopes: [`./${_constants.API_DIR}`]
+        moduleScopes: [`./${_utils.API_DIR}`]
       }
     };
   },
@@ -103,13 +108,13 @@ var _default = (0, _core.createPlugin)(() => ({
 
     const modernConfig = (0, _core.useResolvedConfigContext)();
 
-    const rootDir = _utils.path.resolve(appDirectory, _constants.API_DIR);
+    const rootDir = _path.default.resolve(appDirectory, _utils.API_DIR);
 
-    const distDir = _utils.path.resolve(distDirectory, _constants.API_DIR);
+    const distDir = _path.default.resolve(distDirectory, _utils.API_DIR);
 
-    const sourceAbsDir = _utils.path.resolve(appDirectory, _constants.API_DIR);
+    const sourceAbsDir = _path.default.resolve(appDirectory, _utils.API_DIR);
 
-    const tsconfigPath = _utils.path.resolve(appDirectory, TS_CONFIG_FILENAME);
+    const tsconfigPath = _path.default.resolve(appDirectory, TS_CONFIG_FILENAME);
 
     const babelConfig = (0, _serverUtils.resolveBabelConfig)(appDirectory, modernConfig, {
       tsconfigPath,
@@ -124,9 +129,9 @@ var _default = (0, _core.createPlugin)(() => ({
       ignore: [`**/__tests__/**`, '**/typings/**', '*.d.ts']
     }, babelConfig);
 
-    if (await _utils.fs.pathExists(rootDir)) {
-      await _utils.fs.copy(rootDir, distDir, {
-        filter: src => !['.ts', '.js'].includes(_utils.path.extname(src)) && src !== tsconfigPath
+    if (await _fsExtra.default.pathExists(rootDir)) {
+      await _fsExtra.default.copy(rootDir, distDir, {
+        filter: src => !['.ts', '.js'].includes(_path.default.extname(src)) && src !== tsconfigPath
       });
     }
 

package/dist/js/node/constants.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.BUILD_FILES = exports.API_DIR = void 0;
-const API_DIR = 'api';
-exports.API_DIR = API_DIR;
+exports.BUILD_FILES = exports.API_APP_NAME = void 0;
+const API_APP_NAME = '_app';
+exports.API_APP_NAME = API_APP_NAME;
 const BUILD_FILES = ['**/*.[tj]sx?', '!**/*.test.jsx?', '!**/*.test.tsx?', '!**/*.spec.jsx?', '!**/*.spec.tsx?', '!__tests__/*.tsx?', '!__tests__/*.jsx?'];
 exports.BUILD_FILES = BUILD_FILES;

package/dist/js/node/loader.js

@@ -17,7 +17,7 @@ async function loader(source) {
 
   const draftOptions = (0, _loaderUtils.getOptions)(this);
   const options = {
-    prefix: draftOptions.prefix,
+    prefix: Array.isArray(draftOptions.prefix) ? draftOptions.prefix[0] : draftOptions.prefix,
     apiDir: draftOptions.apiDir,
     target: draftOptions.target,
     port: Number(draftOptions.port),
@@ -34,6 +34,7 @@ async function loader(source) {
     options.requestCreator = draftOptions.requestCreator;
   }
 
+  options.requireResolve = require.resolve;
   const result = await (0, _bffUtils.generateClient)(options);
 
   if (result.isOk) {

package/dist/js/node/server.js

@@ -5,28 +5,89 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _utils = require("@modern-js/utils");
+var _path = _interopRequireDefault(require("path"));
 
 var _serverPlugin = require("@modern-js/server-plugin");
 
 var _bffUtils = require("@modern-js/bff-utils");
 
+var _core = require("@modern-js/core");
+
+var _utils = require("@modern-js/utils");
+
 var _constants = require("./constants");
 
-var _default = (0, _serverPlugin.createPlugin)(() => ({
-  prepareApiServer(props, next) {
-    const {
-      pwd,
-      prefix
-    } = props;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+class Storage {
+  constructor() {
+    this.middlewares = [];
+  }
+
+  reset() {
+    this.middlewares = [];
+  }
+
+}
+
+const createTransformAPI = storage => ({
+  addMiddleware(fn) {
+    storage.middlewares.push(fn);
+  }
+
+});
+
+var _default = (0, _serverPlugin.createPlugin)(() => {
+  const {
+    appDirectory,
+    distDirectory
+  } = (0, _core.useAppContext)();
+  const root = (0, _utils.isProd)() ? distDirectory : appDirectory;
 
-    const apiDir = _utils.path.resolve(pwd, _constants.API_DIR);
+  const apiPath = _path.default.resolve(root || process.cwd(), _utils.API_DIR);
 
-    (0, _bffUtils.injectAPIHandlerInfos)(apiDir, prefix);
-    return next(props);
+  const apiAppPath = _path.default.resolve(apiPath, _constants.API_APP_NAME);
+
+  const storage = new Storage();
+  const transformAPI = createTransformAPI(storage);
+  const apiMod = (0, _utils.requireExistModule)(apiAppPath);
+
+  if (apiMod) {
+    apiMod(transformAPI);
   }
 
-}), {
+  return {
+    reset() {
+      storage.reset();
+      const newApiModule = (0, _utils.requireExistModule)(apiAppPath);
+
+      if (newApiModule) {
+        newApiModule(transformAPI);
+      }
+    },
+
+    gather({
+      addAPIMiddleware
+    }) {
+      storage.middlewares.forEach(mid => {
+        addAPIMiddleware(mid);
+      });
+    },
+
+    prepareApiServer(props, next) {
+      const {
+        pwd,
+        prefix
+      } = props;
+
+      const apiDir = _path.default.resolve(pwd, _utils.API_DIR);
+
+      (0, _bffUtils.injectAPIHandlerInfos)(apiDir, prefix);
+      return next(props);
+    }
+
+  };
+}, {
   name: '@modern-js/plugin-bff'
 });
 

package/dist/types/cli.d.ts

@@ -2,7 +2,7 @@ declare module '@modern-js/core' {
   interface UserConfig {
     bff: {
       prefix?: string;
-      requestCreater?: string;
+      requestCreator?: string;
       fetcher?: string;
       proxy: Record<string, any>;
     };

package/dist/types/constants.d.ts

@@ -1,2 +1,2 @@
-export declare const API_DIR = "api";
+export declare const API_APP_NAME = "_app";
 export declare const BUILD_FILES: string[];

package/package.json

@@ -11,7 +11,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "1.0.0",
+  "version": "1.1.2-beta.0",
   "jsnext:source": "./src/index.ts",
   "types": "./dist/types/index.d.ts",
   "main": "./dist/js/node/index.js",
@@ -41,26 +41,37 @@
       ]
     }
   },
+  "scripts": {
+    "prepare": "pnpm build",
+    "prepublishOnly": "pnpm build -- --platform",
+    "new": "modern new",
+    "build": "modern build",
+    "dev": "modern build --watch",
+    "test": "modern test"
+  },
   "dependencies": {
     "@babel/core": "^7.15.5",
     "@babel/runtime": "^7",
-    "@modern-js/babel-chain": "^1.0.0",
-    "@modern-js/babel-compiler": "^1.0.0",
-    "@modern-js/babel-preset-lib": "^1.0.0",
-    "@modern-js/server-utils": "^1.0.0",
-    "@modern-js/utils": "^1.0.0",
+    "@modern-js/babel-chain": "workspace:^1.1.1",
+    "@modern-js/babel-compiler": "workspace:^1.1.2",
+    "@modern-js/babel-preset-lib": "workspace:^1.1.1",
+    "@modern-js/create-request": "workspace:^1.1.1",
+    "@modern-js/server-utils": "workspace:^1.1.1",
+    "@modern-js/utils": "workspace:^1.1.2",
+    "fs-extra": "^10.0.0",
     "loader-utils": "^2.0.0"
   },
   "devDependencies": {
-    "@modern-js/core": "^1.0.0",
-    "@modern-js/bff-utils": "^1.0.0",
-    "@modern-js/server-plugin": "^1.0.0",
-    "@modern-js/plugin-testing": "^1.0.0",
-    "@modern-js/plugin-analyze": "^1.0.0",
-    "@modern-js/create-request": "^1.0.0",
-    "@modern-js/runtime": "^1.0.0",
-    "@modern-js/types": "^1.0.0",
+    "@modern-js/bff-utils": "workspace:^1.1.1",
+    "@modern-js/core": "workspace:^1.1.2",
+    "@modern-js/module-tools": "^1.1.1",
+    "@modern-js/plugin-analyze": "workspace:^1.1.1",
+    "@modern-js/plugin-testing": "^1.1.1",
+    "@modern-js/runtime": "workspace:^1.1.1",
+    "@modern-js/server-plugin": "workspace:^1.1.1",
+    "@modern-js/types": "workspace:^1.1.2",
     "@types/babel__core": "^7.1.15",
+    "@types/fs-extra": "^9.0.13",
     "@types/jest": "^26",
     "@types/loader-utils": "^2.0.3",
     "@types/node": "^14",
@@ -68,13 +79,12 @@
     "ts-jest": "^27.0.5",
     "typescript": "^4",
     "webpack": "^5.54.0",
-    "webpack-chain": "^6.5.1",
-    "@modern-js/module-tools": "^1.0.0"
+    "webpack-chain": "^6.5.1"
   },
   "peerDependencies": {
-    "@modern-js/core": "^1.0.0",
-    "@modern-js/server-plugin": "^1.0.0",
-    "@modern-js/bff-utils": "^1.0.0"
+    "@modern-js/bff-utils": "workspace:^1.1.1",
+    "@modern-js/core": "workspace:^1.1.2",
+    "@modern-js/server-plugin": "workspace:^1.1.1"
   },
   "modernConfig": {
     "output": {
@@ -85,11 +95,5 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
-  },
-  "scripts": {
-    "new": "modern new",
-    "build": "modern build",
-    "dev": "modern build --watch",
-    "test": "modern test"
   }
-}
+}

package/src/cli.ts

@@ -1,22 +1,23 @@
+import path from 'path';
+import fs from 'fs-extra';
 import {
   createPlugin,
   useAppContext,
   useResolvedConfigContext,
 } from '@modern-js/core';
 import { compiler } from '@modern-js/babel-compiler';
-import { PLUGIN_SCHEMAS, path, fs, upath } from '@modern-js/utils';
+import { PLUGIN_SCHEMAS, normalizeOutputPath, API_DIR } from '@modern-js/utils';
 import { resolveBabelConfig } from '@modern-js/server-utils';
 
 import type { Configuration } from 'webpack';
 import type Chain from 'webpack-chain';
 import type { ServerRoute } from '@modern-js/types';
-import { API_DIR } from './constants';
 
 declare module '@modern-js/core' {
   interface UserConfig {
     bff: {
       prefix?: string;
-      requestCreater?: string;
+      requestCreator?: string;
       fetcher?: string;
       proxy: Record<string, any>;
     };
@@ -49,20 +50,25 @@ export default createPlugin(
 
             chain.resolve.alias.set('@api', rootDir);
 
-            const apiRegexp = new RegExp(`${appDirectory}/api/.*(.[tj]s)$`);
+            const apiRegexp = new RegExp(
+              normalizeOutputPath(
+                `${appDirectory}${path.sep}api${path.sep}.*(.[tj]s)$`,
+              ),
+            );
             chain.module
               .rule('loaders')
               .oneOf('bff-client')
               .before('fallback')
               .test(apiRegexp)
               .use('custom-loader')
-              .loader(upath.normalizeSafe(require.resolve('./loader')))
+              .loader(require.resolve('./loader').replace(/\\/g, '/'))
               .options({
                 prefix,
                 apiDir: rootDir,
                 port,
                 fetcher,
                 target: _config.name,
+                requestCreator: bff?.requestCreator,
               });
           },
         },

package/src/constants.ts

@@ -1,4 +1,4 @@
-export const API_DIR = 'api';
+export const API_APP_NAME = '_app';
 
 export const BUILD_FILES = [
   '**/*.[tj]sx?',

package/src/loader.ts

@@ -20,7 +20,9 @@ async function loader(this: LoaderContext<APILoaderOptions>, source: string) {
   const draftOptions = getOptions(this as any);
 
   const options: GenClientOptions = {
-    prefix: draftOptions.prefix as string,
+    prefix: (Array.isArray(draftOptions.prefix)
+      ? draftOptions.prefix[0]
+      : draftOptions.prefix) as string,
     apiDir: draftOptions.apiDir as string,
     target: draftOptions.target as string,
     port: Number(draftOptions.port),
@@ -37,6 +39,8 @@ async function loader(this: LoaderContext<APILoaderOptions>, source: string) {
     options.requestCreator = draftOptions.requestCreator as string;
   }
 
+  options.requireResolve = require.resolve;
+
   const result = await generateClient(options);
 
   if (result.isOk) {

package/src/server.ts

@@ -1,18 +1,64 @@
-import { path } from '@modern-js/utils';
+import path from 'path';
 import { createPlugin } from '@modern-js/server-plugin';
 import { injectAPIHandlerInfos } from '@modern-js/bff-utils';
-import { API_DIR } from './constants';
+import { useAppContext } from '@modern-js/core';
+import { API_DIR, isProd, requireExistModule } from '@modern-js/utils';
+import { API_APP_NAME } from './constants';
+
+type SF = (args: any) => void;
+class Storage {
+  public middlewares: SF[] = [];
+
+  reset() {
+    this.middlewares = [];
+  }
+}
+
+const createTransformAPI = (storage: Storage) => ({
+  addMiddleware(fn: SF) {
+    storage.middlewares.push(fn);
+  },
+});
 
 export default createPlugin(
-  () => ({
-    prepareApiServer(props, next) {
-      const { pwd, prefix } = props;
-      const apiDir = path.resolve(pwd, API_DIR);
+  () => {
+    const { appDirectory, distDirectory } = useAppContext();
+
+    const root = isProd() ? distDirectory : appDirectory;
+
+    const apiPath = path.resolve(root || process.cwd(), API_DIR);
+    const apiAppPath = path.resolve(apiPath, API_APP_NAME);
+
+    const storage = new Storage();
+    const transformAPI = createTransformAPI(storage);
+
+    const apiMod = requireExistModule(apiAppPath);
+    if (apiMod) {
+      apiMod(transformAPI);
+    }
+
+    return {
+      reset() {
+        storage.reset();
+        const newApiModule = requireExistModule(apiAppPath);
+        if (newApiModule) {
+          newApiModule(transformAPI);
+        }
+      },
+      gather({ addAPIMiddleware }) {
+        storage.middlewares.forEach(mid => {
+          addAPIMiddleware(mid);
+        });
+      },
+      prepareApiServer(props, next) {
+        const { pwd, prefix } = props;
+        const apiDir = path.resolve(pwd, API_DIR);
 
-      injectAPIHandlerInfos(apiDir, prefix);
+        injectAPIHandlerInfos(apiDir, prefix);
 
-      return next(props);
-    },
-  }),
+        return next(props);
+      },
+    };
+  },
   { name: '@modern-js/plugin-bff' },
 ) as any;

package/tests/.eslintrc.js

@@ -0,0 +1,6 @@
+module.exports = {
+  extends: ['@modern-js'],
+  parserOptions: {
+    project: require.resolve('./tsconfig.json'),
+  },
+};

package/tests/__snapshots__/cli.test.ts.snap

@@ -15,39 +15,6 @@ Array [
 ]
 `;
 
-exports[`bff cli plugin config webpack chain 1`] = `
-Object {
-  "module": Object {
-    "rules": Array [
-      Object {
-        "oneOf": Array [
-          Object {
-            "test": /\\.\\\\/fixtures\\\\/function\\\\/api\\\\/\\.\\*\\(\\.\\[tj\\]s\\)\\$/,
-            "use": Array [
-              Object {
-                "loader": "/packages/cli/plugin-bff/src/loader.ts",
-                "options": Object {
-                  "apiDir": "/packages/cli/plugin-bff/fixtures/function/api",
-                  "fetcher": undefined,
-                  "port": 3000,
-                  "prefix": "/api",
-                  "target": undefined,
-                },
-              },
-            ],
-          },
-        ],
-      },
-    ],
-  },
-  "resolve": Object {
-    "alias": Object {
-      "@api": "/packages/cli/plugin-bff/fixtures/function/api",
-    },
-  },
-}
-`;
-
 exports[`bff cli plugin schema 1`] = `
 Array [
   Array [
@@ -58,12 +25,18 @@ Array [
             "type": "string",
           },
           "prefix": Object {
-            "type": "string",
+            "items": Object {
+              "type": "string",
+            },
+            "type": Array [
+              "string",
+              "array",
+            ],
           },
           "proxy": Object {
             "type": "object",
           },
-          "requestCreater": Object {
+          "requestCreator": Object {
             "type": "string",
           },
         },

package/tests/cli.test.ts

@@ -1,14 +1,14 @@
-import { path } from '@modern-js/utils';
+import path from 'path';
 import { manager, AppContext } from '@modern-js/core';
 import { modifyServerRoutes } from '@modern-js/plugin-analyze';
 import Chain from 'webpack-chain';
 import plugin from '../src/cli';
 
-const root = path.resolve(__dirname, '../../../../');
+const root = path.normalize(path.resolve(__dirname, '../../../../'));
 expect.addSnapshotSerializer({
   test: val =>
     typeof val === 'string' &&
-    (val.includes('modern-js') ||
+    (val.includes('modern.js') ||
       val.includes('node_modules') ||
       val.includes(root)),
   print: val =>
@@ -17,8 +17,8 @@ expect.addSnapshotSerializer({
       ? // eslint-disable-next-line no-nested-ternary
         val.includes('node_modules')
         ? `"${val.replace(/.+node_modules/, '')}"`
-        : val.includes('modern-js')
-        ? `"${val.replace(/.+modern-js/, '')}"`
+        : val.includes('modern.js')
+        ? `"${val.replace(/.+modern\.js/, '')}"`
         : `"${val.replace(root, '')}"`
       : (val as string),
 });
@@ -53,7 +53,38 @@ describe('bff cli plugin', () => {
     });
     manager.run(() => tools.webpack({}, { chain }));
 
-    expect(chain.toConfig()).toMatchSnapshot();
+    expect(chain.toConfig()).toMatchObject({
+      module: {
+        rules: [
+          {
+            oneOf: [
+              {
+                test: /.\/fixtures\/function\/api\/\.*(\.[tj]s)$/,
+                use: [
+                  {
+                    loader: require
+                      .resolve('../src/loader.ts')
+                      .replace(/\\/g, '/'),
+                    options: {
+                      apiDir: path.resolve('./fixtures/function/api'),
+                      fetcher: undefined,
+                      port: 3000,
+                      prefix: '/api',
+                      target: undefined,
+                    },
+                  },
+                ],
+              },
+            ],
+          },
+        ],
+      },
+      resolve: {
+        alias: {
+          '@api': path.resolve('./fixtures/function/api'),
+        },
+      },
+    });
   });
 
   it('server routes', async () => {

package/tests/compiler.ts

@@ -1,4 +1,4 @@
-import { path } from '@modern-js/utils';
+import path from 'path';
 import webpack from 'webpack';
 import { createFsFromVolume, Volume } from 'memfs';
 import { APILoaderOptions } from '../src/loader';

package/tests/loader.test.ts

@@ -1,4 +1,4 @@
-import { path } from '@modern-js/utils';
+import path from 'path';
 import { compiler } from './compiler';
 
 const apiDir = path.resolve(__dirname, './fixtures/function/api');
@@ -10,7 +10,7 @@ const root = path.resolve(__dirname, '../../../../');
 expect.addSnapshotSerializer({
   test: val =>
     typeof val === 'string' &&
-    (val.includes('modern-js') ||
+    (val.includes('modern.js') ||
       val.includes('node_modules') ||
       val.includes(root)),
   print: val =>
@@ -18,9 +18,9 @@ expect.addSnapshotSerializer({
     typeof val === 'string'
       ? // eslint-disable-next-line no-nested-ternary
         val.includes('node_modules')
-        ? `"${val.replace(/.+node_modules/, '')}"`
-        : val.includes('modern-js')
-        ? `"${val.replace(/.+modern-js/, '')}"`
+        ? `"${val.replace(/'.+node_modules/, `'`)}"`
+        : val.includes('modern.js')
+        ? `"${val.replace(/'.+modern\.js/, `'`)}"`
         : `"${val.replace(root, '')}"`
       : (val as string),
 });
@@ -80,7 +80,9 @@ describe('bff loader', () => {
       prefix: '',
       port: 80,
       target: 'client',
-      fetcher: path.resolve(__dirname, './fixtures/test-fetcher'),
+      fetcher: path
+        .resolve(__dirname, './fixtures/test-fetcher')
+        .replace(/\\/g, '/'),
     });
     const output = stats?.toJson({ source: true }).modules?.[0]?.source;
 
@@ -93,7 +95,9 @@ describe('bff loader', () => {
       prefix: '',
       port: 80,
       target: 'client',
-      requestCreator: path.resolve(__dirname, './fixtures/test-requestCreator'),
+      requestCreator: path
+        .resolve(__dirname, './fixtures/test-requestCreator')
+        .replace(/\\/g, '/'),
     });
     const output = stats?.toJson({ source: true }).modules?.[0]?.source;
 

package/tests/server.test.ts

@@ -1,4 +1,4 @@
-import { path } from '@modern-js/utils';
+import path from 'path';
 import { serverManager } from '@modern-js/server-plugin';
 import { useAPIHandlerInfos } from '@modern-js/bff-utils';
 import plugin from '../src/server';