@modern-js/server 1.2.1-beta.1 → 1.2.2-beta.0

package/src/dev-tools/mock/index.ts

@@ -3,8 +3,8 @@ import { fs } from '@modern-js/utils';
 import { match } from 'path-to-regexp';
 import { NextFunction } from '../../type';
 import { ModernServerContext } from '../../libs/context';
+import { AGGRED_DIR } from '../../constants';
 import getMockData, { MockApi } from './getMockData';
-import { AGGRED_DIR } from '@/constants';
 
 const getMatched = (context: ModernServerContext, mockApiList: MockApi[]) => {
   const { path: targetPathname, method: targetMethod } = context;

package/src/dev-tools/socket-server.ts

@@ -4,7 +4,7 @@ import ws from 'ws';
 import type { Stats } from 'webpack';
 import { logger } from '@modern-js/utils';
 import { DevServerOptions } from '../type';
-import { noop } from '@/utils';
+import { noop } from '../utils';
 
 interface ExtWebSocket extends ws {
   isAlive: boolean;

package/src/dev-tools/watcher/index.ts

@@ -1,4 +1,5 @@
-import chokidar, { FSWatcher } from 'chokidar';
+import path from 'path';
+import chokidar, { FSWatcher, WatchOptions } from 'chokidar';
 import { DependencyTree } from './dependency-tree';
 import { StatsCache } from './stats-cache';
 
@@ -18,14 +19,16 @@ export default class Watcher {
 
   private watcher!: FSWatcher;
 
-  public listen(files: string[], callback: (changed: string) => void) {
+  public listen(
+    files: string[],
+    options: WatchOptions,
+    callback: (changed: string) => void,
+  ) {
     const watched = files.filter(Boolean);
+    const filenames = watched.map(filename => filename.replace(/\\/g, '/'));
 
     const cache = new StatsCache();
-    const watcher = chokidar.watch(watched, {
-      // 初始化的时候不触发 add、addDir 事件
-      ignoreInitial: true,
-    });
+    const watcher = chokidar.watch(filenames, options);
 
     watcher.on('ready', () => {
       cache.add(getWatchedFiles(watcher));

package/src/libs/metrics.ts

@@ -1,4 +1,4 @@
-import { Metrics } from '@/type';
+import { Metrics } from '../type';
 
 const metrics: Metrics = {
   gauges() {

package/src/libs/render/cache/index.ts

@@ -1,9 +1,9 @@
 import { ModernServerContext } from '../../context';
 import { RenderFunction, SSRServerContext } from '../type';
+import { ERROR_DIGEST } from '../../../constants';
 import { createCache } from './spr';
 import { namespaceHash, withCoalescedInvoke } from './util';
 import { CacheContext } from './type';
-import { ERROR_DIGEST } from '@/constants';
 
 export default (renderFn: RenderFunction, ctx: ModernServerContext) => {
   const sprCache = createCache();

package/src/libs/render/index.ts

@@ -1,15 +1,14 @@
 import path from 'path';
 import { fs } from '@modern-js/utils';
 import mime from 'mime-types';
-import { RenderResult } from '../../type';
+import { RenderResult, ServerHookRunner } from '../../type';
 import { ModernRoute } from '../route';
 import { ModernServerContext } from '../context';
+import { ERROR_DIGEST } from '../../constants';
 import { handleDirectory } from './static';
 import { readFile } from './reader';
 import * as ssr from './ssr';
 import { supportModern, getModernEntry } from './modern';
-import { ERROR_DIGEST } from '@/constants';
-import { ServerHookRunner } from '@/type';
 
 export const createRenderHandler = ({
   distDir,

package/src/libs/render/modern/index.ts

@@ -1,9 +1,10 @@
 import Parser from 'ua-parser-js';
-import nativeModules from '@babel/compat-data/native-modules';
 import compareVersions from 'compare-versions';
 import { ModernServerContext } from '../../context';
 import { NativeModuleNameMap } from './browser-list';
 
+const nativeModules = require('@babel/compat-data/native-modules');
+
 export const supportModern = (context: ModernServerContext) => {
   if (context.query.modern_es6) {
     return true;

package/src/libs/render/ssr.ts

@@ -2,10 +2,9 @@ import path from 'path';
 import { SERVER_RENDER_FUNCTION_NAME } from '@modern-js/utils';
 import mime from 'mime-types';
 import { ModernServerContext } from '../context';
-import { RenderResult } from '../../type';
+import { RenderResult, ServerHookRunner } from '../../type';
 import cache from './cache';
 import { SSRServerContext } from './type';
-import { ServerHookRunner } from '@/type';
 
 export const render = async (
   ctx: ModernServerContext,

package/src/server/dev-server/dev-server-split.ts

@@ -1,8 +1,8 @@
 import type { APIServerStartInput } from '@modern-js/server-plugin';
+import { mergeExtension } from '../../utils';
+import { ModernRouteInterface } from '../../libs/route';
+import { ApiServerMode } from '../../constants';
 import { ModernDevServer } from './dev-server';
-import { mergeExtension } from '@/utils';
-import { ModernRouteInterface } from '@/libs/route';
-import { ApiServerMode } from '@/constants';
 
 export class ModernSSRDevServer extends ModernDevServer {
   protected prepareAPIHandler(

package/src/server/dev-server/dev-server.ts

@@ -15,23 +15,23 @@ import {
 import type { MultiCompiler, Compiler } from 'webpack';
 import webpackDevMiddleware from 'webpack-dev-middleware';
 import { ModernServer } from '../modern-server';
-import { createMockHandler } from '@/dev-tools/mock';
-import { createProxyHandler, ProxyOptions } from '@/libs/proxy';
+import { createMockHandler } from '../../dev-tools/mock';
+import { createProxyHandler, ProxyOptions } from '../../libs/proxy';
 import {
   DevServerOptions,
   ModernServerOptions,
   NextFunction,
   ServerHookRunner,
   ReadyOptions,
-} from '@/type';
-import SocketServer from '@/dev-tools/socket-server';
-import DevServerPlugin from '@/dev-tools/dev-server-plugin';
-import { ModernServerContext } from '@/libs/context';
-import { createLaunchEditorHandler } from '@/dev-tools/launch-editor';
-import { enableRegister } from '@/dev-tools/babel/register';
-import * as reader from '@/libs/render/reader';
-import Watcher from '@/dev-tools/watcher';
-import { AGGRED_DIR } from '@/constants';
+} from '../../type';
+import SocketServer from '../../dev-tools/socket-server';
+import DevServerPlugin from '../../dev-tools/dev-server-plugin';
+import { ModernServerContext } from '../../libs/context';
+import { createLaunchEditorHandler } from '../../dev-tools/launch-editor';
+import { enableRegister } from '../../dev-tools/babel/register';
+import * as reader from '../../libs/render/reader';
+import Watcher from '../../dev-tools/watcher';
+import { AGGRED_DIR } from '../../constants';
 
 const DEFAULT_DEV_OPTIONS: DevServerOptions = {
   client: {
@@ -166,7 +166,7 @@ export class ModernDevServer extends ModernServer {
     const { dev } = this;
     const devHttpsOption = typeof dev === 'object' && dev.https;
     if (devHttpsOption) {
-      const { genHttpsOptions } = require('@/dev-tools/https');
+      const { genHttpsOptions } = require('../../dev-tools/https');
       const httpsOptions = await genHttpsOptions(devHttpsOption);
       return createHttpsServer(httpsOptions, handler);
     } else {
@@ -252,32 +252,45 @@ export class ModernDevServer extends ModernServer {
     const { pwd } = this;
     const { mock } = AGGRED_DIR;
     const defaultWatched = [
-      `${pwd}/${mock}/**/*`,
-      `${pwd}/${SERVER_DIR}/**/*`,
-      `${pwd}/${API_DIR}/!(typings)/**`,
-      `${pwd}/${SHARED_DIR}/**/*`,
+      `${mock}/**/*`,
+      `${SERVER_DIR}/**/*`,
+      `${API_DIR}/**`,
+      `${SHARED_DIR}/**/*`,
     ];
 
+    const defaultWatchedPaths = defaultWatched.map(p =>
+      path.normalize(path.join(pwd, p)),
+    );
+    const mockPath = path.normalize(path.join(pwd, mock));
+
     const watcher = new Watcher();
     watcher.createDepTree();
 
     // 监听文件变动，如果有变动则给 client，也就是 start 启动的插件发消息
-    watcher.listen(defaultWatched, (filepath: string) => {
-      watcher.updateDepTree();
-      watcher.cleanDepCache(filepath);
-
-      this.runner.reset();
-
-      if (filepath.startsWith(`${pwd}/${mock}`)) {
-        this.mockHandler = createMockHandler({ pwd });
-      } else {
-        try {
-          this.prepareFrameHandler();
-        } catch (e) {
-          this.logger.error(e as Error);
+    watcher.listen(
+      defaultWatchedPaths,
+      {
+        // 初始化的时候不触发 add、addDir 事件
+        ignoreInitial: true,
+        ignored: /api\/typings\/**/,
+      },
+      (filepath: string) => {
+        watcher.updateDepTree();
+        watcher.cleanDepCache(filepath);
+
+        this.runner.reset();
+
+        if (filepath.startsWith(mockPath)) {
+          this.mockHandler = createMockHandler({ pwd });
+        } else {
+          try {
+            this.prepareFrameHandler();
+          } catch (e) {
+            this.logger.error(e as Error);
+          }
         }
-      }
-    });
+      },
+    );
 
     this.watcher = watcher;
   }

package/src/server/index.ts

@@ -10,6 +10,8 @@ import {
   ConfigContext,
   UserConfig,
 } from '@modern-js/core';
+import { ModernServerOptions, ServerHookRunner, ReadyOptions } from '../type';
+import { metrics as defaultMetrics } from '../libs/metrics';
 import { ModernServer } from './modern-server';
 import type { ModernDevServer } from './dev-server';
 import {
@@ -17,8 +19,6 @@ import {
   ModernSSRServer,
   ModernWebServer,
 } from './modern-server-split';
-import { ModernServerOptions, ServerHookRunner, ReadyOptions } from '@/type';
-import { metrics as defaultMetrics } from '@/libs/metrics';
 
 export class Server {
   public options: ModernServerOptions;
@@ -67,8 +67,8 @@ export class Server {
     return this;
   }
 
-  public listen(port: number, listener: any) {
-    this.app.listen(port || process.env.PORT, () => {
+  public listen(port = 8080, listener: any) {
+    this.app.listen(process.env.PORT || port, () => {
       if (listener) {
         listener();
       }

package/src/server/modern-server-split.ts

@@ -1,9 +1,9 @@
 import { APIServerStartInput } from '@modern-js/server-plugin';
+import { mergeExtension } from '../utils';
+import { ModernRoute, ModernRouteInterface, RouteMatcher } from '../libs/route';
+import { ApiServerMode } from '../constants';
+import { ModernServerContext } from '../libs/context';
 import { ModernServer } from './modern-server';
-import { mergeExtension } from '@/utils';
-import { ModernRoute, ModernRouteInterface, RouteMatcher } from '@/libs/route';
-import { ApiServerMode } from '@/constants';
-import { ModernServerContext } from '@/libs/context';
 
 export class ModernSSRServer extends ModernServer {
   // Todo should not invoke any route hook in modernSSRServer

package/src/server/modern-server.ts

@@ -4,10 +4,10 @@ import util from 'util';
 import path from 'path';
 import { fs, ROUTE_SPEC_FILE } from '@modern-js/utils';
 import { Adapter, APIServerStartInput } from '@modern-js/server-plugin';
-import { createMiddlewareCollecter } from '@modern-js/server-utils';
 import type { NormalizedConfig } from '@modern-js/core';
 import mime from 'mime-types';
 import axios from 'axios';
+import clone from 'lodash.clone';
 import {
   ModernServerOptions,
   NextFunction,
@@ -16,27 +16,32 @@ import {
   Logger,
   ReadyOptions,
   ConfWithBFF,
-} from '@/type';
+} from '../type';
 import {
   RouteMatchManager,
   ModernRouteInterface,
   ModernRoute,
   RouteMatcher,
-} from '@/libs/route';
-import { createRenderHandler } from '@/libs/render';
-import { createStaticFileHandler } from '@/libs/serve-file';
-import { createErrorDocument, mergeExtension, noop } from '@/utils';
-import * as reader from '@/libs/render/reader';
-import { createProxyHandler, ProxyOptions } from '@/libs/proxy';
-import { createContext, ModernServerContext } from '@/libs/context';
+} from '../libs/route';
+import { createRenderHandler } from '../libs/render';
+import { createStaticFileHandler } from '../libs/serve-file';
+import {
+  createErrorDocument,
+  createMiddlewareCollecter,
+  mergeExtension,
+  noop,
+} from '../utils';
+import * as reader from '../libs/render/reader';
+import { createProxyHandler, ProxyOptions } from '../libs/proxy';
+import { createContext, ModernServerContext } from '../libs/context';
 import {
   AGGRED_DIR,
   ApiServerMode,
   ERROR_DIGEST,
   ERROR_PAGE_TEXT,
-} from '@/constants';
-import { createTemplateAPI } from '@/libs/hook-api/template';
-import { createRouteAPI } from '@/libs/hook-api/route';
+} from '../constants';
+import { createTemplateAPI } from '../libs/hook-api/template';
+import { createRouteAPI } from '../libs/hook-api/route';
 
 type ModernServerHandler = (
   context: ModernServerContext,
@@ -319,9 +324,13 @@ export class ModernServer {
 
   protected async emitRouteHook(
     eventName: 'beforeMatch' | 'afterMatch' | 'beforeRender' | 'afterRender',
-    input: any,
+    input: {
+      context: ModernServerContext;
+      [propsName: string]: any;
+    },
   ) {
-    return this.runner[eventName](input, { onLast: noop as any });
+    input.context = clone(input.context);
+    return this.runner[eventName](input as any, { onLast: noop as any });
   }
 
   // warmup ssr function

package/src/utils.ts

@@ -49,3 +49,31 @@ export const createErrorDocument = (status: number, text: string) => {
   </html>
   `;
 };
+
+export type CollectMiddlewaresResult = {
+  web: any[];
+  api: any[];
+};
+
+export const createMiddlewareCollecter = () => {
+  const webMiddlewares: any[] = [];
+  const apiMiddlewares: any[] = [];
+
+  const addWebMiddleware = (input: any) => {
+    webMiddlewares.push(input);
+  };
+
+  const addAPIMiddleware = (input: any) => {
+    apiMiddlewares.push(input);
+  };
+
+  const getMiddlewares = (): CollectMiddlewaresResult => ({
+    web: webMiddlewares,
+    api: apiMiddlewares,
+  });
+  return {
+    getMiddlewares,
+    addWebMiddleware,
+    addAPIMiddleware,
+  };
+};

package/tests/dev.test.ts

@@ -0,0 +1,39 @@
+import http from 'http';
+import SocketServer from '../src/dev-tools/socket-server';
+
+describe('test dev tools', () => {
+  test('should socket server work correctly', () => {
+    const socketServer: any = new SocketServer({
+      client: {
+        port: '8080',
+        overlay: false,
+        logging: 'error',
+        path: '/',
+        host: '127.0.0.1',
+      },
+      dev: {
+        writeToDisk: false,
+      },
+      watch: true,
+      hot: true,
+      liveReload: true,
+    });
+    const app = http
+      .createServer((req, res) => {
+        res.end();
+      })
+      .listen(8080);
+
+    socketServer.prepare(app);
+    expect(socketServer.app).toBe(app);
+    expect(socketServer.stats).toBeUndefined();
+
+    const mockStats = {
+      toJson: () => ({}),
+    };
+    socketServer.updateStats(mockStats);
+    expect(socketServer.stats).toBe(mockStats);
+
+    app.close();
+  });
+});

package/tests/fixtures/pure/tsconfig.json

@@ -5,7 +5,7 @@
     "jsx": "preserve",
     "baseUrl": "./",
     "paths": {
-      "@/*": ["./src/*"],
+      ,
       "@shared/*": ["./shared/*"]
     }
   },

package/tests/middleware.test.ts

@@ -1,4 +1,3 @@
-/* eslint-disable max-nested-callbacks */
 import path from 'path';
 import EventEmitter from 'events';
 import { Readable } from 'stream';
@@ -66,12 +65,15 @@ describe('test middleware create factory', () => {
     let sourceServerPort = 8080;
     let sourceServer: Server | null = null;
     beforeAll(async () => {
+      let done: any;
+      const promise = new Promise(resolve => (done = resolve));
       sourceServerPort = await portfinder.getPortPromise();
       sourceServer = createServer((req, res) => {
         res.setHeader('Access-Control-Allow-Origin', '*');
         res.write(req.url?.slice(1));
         res.end();
-      }).listen(sourceServerPort);
+      }).listen(sourceServerPort, done);
+      return promise;
     });
 
     afterAll(() => {
@@ -83,7 +85,7 @@ describe('test middleware create factory', () => {
     test('should proxy correctly use simply options', async () => {
       const port = await portfinder.getPortPromise();
       const middlewares = createProxyHandler({
-        '/simple': `http://127.0.0.1:${sourceServerPort}`,
+        '/simple': `http://localhost:${sourceServerPort}`,
       });
       const proxyHandler = middlewares![0];
 
@@ -95,7 +97,7 @@ describe('test middleware create factory', () => {
       }).listen(port);
 
       try {
-        const { data } = await axios.get(`http://127.0.0.1:${port}/simple`);
+        const { data } = await axios.get(`http://localhost:${port}/simple`);
         expect(data).toBe('simple');
       } finally {
         server.close();
@@ -106,7 +108,7 @@ describe('test middleware create factory', () => {
       const port = await portfinder.getPortPromise();
       const middlewares = createProxyHandler({
         '/simple-obj': {
-          target: `http://127.0.0.1:${sourceServerPort}`,
+          target: `http://localhost:${sourceServerPort}`,
         },
       });
       const proxyHandler = middlewares![0];
@@ -119,7 +121,7 @@ describe('test middleware create factory', () => {
       }).listen(port);
 
       try {
-        const { data } = await axios.get(`http://127.0.0.1:${port}/simple-obj`);
+        const { data } = await axios.get(`http://localhost:${port}/simple-obj`);
         expect(data).toBe('simple-obj');
       } finally {
         server.close();
@@ -130,7 +132,7 @@ describe('test middleware create factory', () => {
       const port = await portfinder.getPortPromise();
       const middlewares = createProxyHandler({
         context: '/context',
-        target: `http://127.0.0.1:${sourceServerPort}`,
+        target: `http://localhost:${sourceServerPort}`,
       });
       const proxyHandler = middlewares![0];
 
@@ -142,7 +144,7 @@ describe('test middleware create factory', () => {
       }).listen(port);
 
       try {
-        const { data } = await axios.get(`http://127.0.0.1:${port}/context`);
+        const { data } = await axios.get(`http://localhost:${port}/context`);
         expect(data).toBe('context');
       } finally {
         server.close();
@@ -154,7 +156,7 @@ describe('test middleware create factory', () => {
       const middlewares = createProxyHandler([
         {
           context: '/array',
-          target: `http://127.0.0.1:${sourceServerPort}`,
+          target: `http://localhost:${sourceServerPort}`,
         },
       ]);
       const proxyHandler = middlewares![0];
@@ -167,7 +169,7 @@ describe('test middleware create factory', () => {
       }).listen(port);
 
       try {
-        const { data } = await axios.get(`http://127.0.0.1:${port}/array`);
+        const { data } = await axios.get(`http://localhost:${port}/array`);
         expect(data).toBe('array');
       } finally {
         server.close();
@@ -175,4 +177,3 @@ describe('test middleware create factory', () => {
     });
   });
 });
-/* eslint-enable max-nested-callbacks */

package/tests/server.test.ts

@@ -2,6 +2,7 @@ import path from 'path';
 import { defaultsConfig, NormalizedConfig } from '@modern-js/core';
 import { ModernServerContext, NextFunction } from '@modern-js/types';
 import createServer, { Server } from '../src';
+import { ModernServer } from '../src/server/modern-server';
 
 describe('test server', () => {
   test('should throw error when ', resolve => {
@@ -58,7 +59,7 @@ describe('test server', () => {
         config: defaultsConfig as NormalizedConfig,
         pwd: appDirectory,
       });
-      const modernServer = server.server as any;
+      const modernServer = (server as any).server;
 
       const len = modernServer.handlers.length;
 
@@ -85,5 +86,16 @@ describe('test server', () => {
       expect(newLen + 1).toBe(nextLen);
       expect(modernServer.handlers[nextLen - 1]).toBe(asyncHandler);
     });
+
+    test('should get request handler correctly', async () => {
+      const server = await createServer({
+        config: defaultsConfig as NormalizedConfig,
+        pwd: appDirectory,
+      });
+
+      const modernServer: ModernServer = (server as any).server;
+      const handler = modernServer.getRequestHandler();
+      expect(typeof handler === 'function').toBeTruthy();
+    });
   });
 });

package/tests/tsconfig.json

@@ -7,8 +7,6 @@
     "isolatedModules": true,
     "sourceMap": true
   },
-  "paths": {
-    "@/*": ["../src/*"]
-  },
+  "paths": {},
   "exclude": ["src/__test__/fixtures/**"]
 }

package/tests/utils.test.ts

@@ -3,6 +3,7 @@ import {
   mergeExtension,
   toMessage,
   createErrorDocument,
+  createMiddlewareCollecter,
 } from '../src/utils';
 
 describe('test server utils', () => {
@@ -37,4 +38,34 @@ describe('test server utils', () => {
     expect(doc).toMatch('redirect');
     expect(doc).toMatch('302: redirect');
   });
+
+  describe('test middleware collector', () => {
+    test('shoule return web middleware correctly', () => {
+      const { addWebMiddleware, getMiddlewares } = createMiddlewareCollecter();
+
+      const before = getMiddlewares();
+      expect(before.web).toEqual([]);
+
+      const middleware = async () => {
+        // empty
+      };
+      addWebMiddleware(middleware);
+      const after = getMiddlewares();
+      expect(after.web).toEqual([middleware]);
+    });
+
+    test('shoule return api middleware correctly', () => {
+      const { addAPIMiddleware, getMiddlewares } = createMiddlewareCollecter();
+
+      const before = getMiddlewares();
+      expect(before.web).toEqual([]);
+
+      const middleware = async () => {
+        // empty
+      };
+      addAPIMiddleware(middleware);
+      const after = getMiddlewares();
+      expect(after.api).toEqual([middleware]);
+    });
+  });
 });

package/tsconfig.json

@@ -5,9 +5,7 @@
     "jsx": "preserve",
     "baseUrl": "./",
     "esModuleInterop": true,
-    "paths": {
-      "@/*": ["./src/*"]
-    }
+    "paths": {}
   },
   "include": ["src"]
 }