feat(ssr): server file require add types intelligent code (#6149)

umijs · Feb 20, 2021 · d07bcdc · d07bcdc
1 parent cbf73d0
commit d07bcdc
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 3 deletions.
diff --git a/packages/preset-built-in/src/plugins/features/ssr/constants.ts b/packages/preset-built-in/src/plugins/features/ssr/constants.ts
@@ -1,4 +1,5 @@
 export const CHUNK_NAME = 'server';
 export const OUTPUT_SERVER_FILENAME = 'umi.server.js';
+export const OUTPUT_SERVER_TYPE_FILENAME = 'umi.server.d.ts';
 export const TMP_PLUGIN_DIR = 'core/ssr';
 export const CLIENT_EXPORTS = 'clientExports';
diff --git a/packages/preset-built-in/src/plugins/features/ssr/serverTypePlugin.ts b/packages/preset-built-in/src/plugins/features/ssr/serverTypePlugin.ts
@@ -0,0 +1,32 @@
+import { existsSync, readFileSync } from 'fs';
+import { webpack } from '@umijs/types';
+
+/**
+ * generate assets when webpack bundler emit
+ */
+export default class AssetWebpackPlugin {
+  constructor(
+    public assetPaths: { name: string; path?: string; content?: string }[],
+  ) {
+    this.assetPaths = assetPaths;
+  }
+  apply(compiler: webpack.Compiler) {
+    compiler.hooks.emit.tap('AssetWebpack', (compilation) => {
+      this.assetPaths.forEach(({ name, path, content }) => {
+        if (!name) {
+          return;
+        }
+        const filePath = path || '';
+        const assetContent = existsSync(filePath)
+          ? readFileSync(filePath, 'utf-8')
+          : content;
+        if (assetContent) {
+          compilation.assets[name] = {
+            source: () => assetContent,
+            size: () => assetContent.length,
+          };
+        }
+      });
+    });
+  }
+}
diff --git a/packages/preset-built-in/src/plugins/features/ssr/ssr.ts b/packages/preset-built-in/src/plugins/features/ssr/ssr.ts
@@ -1,4 +1,5 @@
 import * as fs from 'fs';
+import { EOL } from 'os';
 import assert from 'assert';
 import * as path from 'path';
 import serialize from 'serialize-javascript';
@@ -8,10 +9,12 @@ import { IApi, BundlerConfigType } from '@umijs/types';
 import { winPath, Mustache, lodash as _, routeToChunkName } from '@umijs/utils';
 import { matchRoutes, RouteConfig } from 'react-router-config';
 import { webpack } from '@umijs/bundler-webpack';
+import ServerTypePlugin from './serverTypePlugin';
 import { getHtmlGenerator } from '../../commands/htmlUtils';
 import {
   CHUNK_NAME,
   OUTPUT_SERVER_FILENAME,
+  OUTPUT_SERVER_TYPE_FILENAME,
   TMP_PLUGIN_DIR,
   CLIENT_EXPORTS,
 } from './constants';
@@ -212,7 +215,9 @@ export default (api: IApi) => {
     config.devServer.writeToDisk = (filePath: string) => {
       const manifestFile =
         api.config?.manifest?.fileName || 'asset-manifest.json';
-      const regexp = new RegExp(`(${OUTPUT_SERVER_FILENAME}|${manifestFile})$`);
+      const regexp = new RegExp(
+        `(${OUTPUT_SERVER_FILENAME}|${OUTPUT_SERVER_TYPE_FILENAME}|${manifestFile})$`,
+      );
       return regexp.test(filePath);
     };
     // enable manifest
@@ -297,6 +302,14 @@ export default (api: IApi) => {
           maxChunks: 1,
         },
       ]);
+      config.plugin('generate-server-type').use(ServerTypePlugin, [
+        [
+          {
+            name: OUTPUT_SERVER_TYPE_FILENAME,
+            content: `import { IServerRender } from 'umi';${EOL}export = render;${EOL}export as namespace render;${EOL}declare const render: IServerRender;`,
+          },
+        ],
+      ]);
       config.plugin('define').tap(([args]) => [
         {
           ...args,

diff --git a/packages/types/index.d.ts b/packages/types/index.d.ts
@@ -385,8 +385,8 @@ interface IServerRenderResult<T = string | Stream> {
   error: Error;
 }
 
-interface IServerRender<T = string> {
-  (params: IServerRenderParams): Promise<IServerRenderResult<T>>;
+interface IServerRender {
+  (params: IServerRenderParams): Promise<IServerRenderResult>;
 }
 
 export type IConfig = WithFalse<BaseIConfig>;