feat: move ssr to platform-web

shuvijs · Nov 8, 2021 · 6949e10 · 6949e10
1 parent 390f40f
commit 6949e10
Show file tree

Hide file tree

Showing 27 changed files with 211 additions and 216 deletions.
diff --git a/packages/platform-core/src/index.ts b/packages/platform-core/src/index.ts
@@ -18,8 +18,6 @@ import {
 import { IManifest } from '@shuvi/toolpack/lib/webpack/types';
 import { IncomingMessage } from 'http';
 
-export { IUserRouteConfig } from '@shuvi/service/lib/types/index';
-
 export {
   IData,
   Application,

diff --git a/packages/platform-mp/src/platform-mp-base/index.ts b/packages/platform-mp/src/platform-mp-base/index.ts
@@ -1,7 +1,10 @@
 import path from 'path';
-import { IApi, APIHooks } from '@shuvi/service';
-import { IUserRouteConfig } from '@shuvi/platform-core';
-import { BUNDLER_TARGET_SERVER } from '@shuvi/shared/lib/constants';
+import {
+  Api,
+  APIHooks,
+  IUserRouteConfig,
+  BUILD_DEFAULT_DIR
+} from '@shuvi/service';
 import { rankRouteBranches } from '@shuvi/router';
 import { PACKAGE_NAME } from '../constants';
 import fs from 'fs';
@@ -76,7 +79,7 @@ export interface IFileType {
 }
 
 export default abstract class PlatformMpBase {
-  _api: IApi;
+  _api: Api;
   themeFilePath: string = '';
   appConfigs!: AppConfigs;
   mpPathToRoutesDone: any;
@@ -88,7 +91,7 @@ export default abstract class PlatformMpBase {
   abstract fileType: IFileType;
   abstract template: RecursiveTemplate | UnRecursiveTemplate;
 
-  constructor(api: IApi) {
+  constructor(api: Api) {
     this._api = api;
     this.promiseRoutes = new Promise(resolve => {
       this.mpPathToRoutesDone = resolve;
@@ -288,24 +291,23 @@ export default abstract class PlatformMpBase {
 
   configWebpack() {
     const api = this._api;
+
     api.tap<APIHooks.IHookBundlerConfig>('bundler:configTarget', {
       name: 'platform-mp',
       fn: async (config, { name }) => {
         await this.promiseRoutes;
-        if (name === BUNDLER_TARGET_SERVER) {
-          config.entryPoints.clear();
-          return config;
-        }
         const pageFiles = getAllFiles(api.resolveAppFile('files', 'pages'));
 
         const entry: Record<string, Record<string, any>> = {
           app: [api.resolveAppFile('entry.client')],
           comp: [resolveAppFile('template', 'comp')],
           'custom-wrapper': [resolveAppFile('template', 'custom-wrapper')]
         };
+
         pageFiles.forEach(page => {
           entry['pages/' + page.name] = [page.filepath];
         });
+
         config.entryPoints.clear();
         config.optimization.clear();
         modifyStyle(config, this.fileType.style);
@@ -314,7 +316,7 @@ export default abstract class PlatformMpBase {
         config.output.chunkFilename('[name].js');
         config.output.filename('[name].js');
         const outputPath = config.output.get('path').split('/');
-        if (outputPath[outputPath.length - 1] === 'client') {
+        if (outputPath[outputPath.length - 1] === BUILD_DEFAULT_DIR) {
           outputPath[outputPath.length - 1] = api.config.platform?.target;
           config.output.path(outputPath.join('/'));
         }
@@ -335,6 +337,34 @@ export default abstract class PlatformMpBase {
             }
           ];
         });
+
+        config.plugin('DomEnvPlugin').use(DomEnvPlugin);
+        config.plugin('BuildAssetsPlugin').use(BuildAssetsPlugin, [
+          {
+            appConfigs: this.appConfigs,
+            themeFilePath: this.themeFilePath,
+            paths: api.paths,
+            fileType: this.fileType,
+            template: this.template
+          }
+        ]);
+        config.plugin('ModifyChunkPlugin').use(ModifyChunkPlugin, [
+          {
+            fileType: this.fileType
+          }
+        ]);
+        const fileLoader = config.module
+          .rule('main')
+          .oneOfs.get('media')
+          .use('file-loader');
+        fileLoader.options({
+          name: '[path][name].[ext]',
+          esModule: false,
+          useRelativePath: true,
+          context: api.paths.srcDir,
+          publicPath: '/'
+        });
+
         config.merge({
           entry,
           resolve: {
@@ -428,33 +458,6 @@ export default abstract class PlatformMpBase {
           enhancedExts(extensions, api.config.platform?.target!)
         );
 
-        config.plugin('DomEnvPlugin').use(DomEnvPlugin);
-        config.plugin('BuildAssetsPlugin').use(BuildAssetsPlugin, [
-          {
-            appConfigs: this.appConfigs,
-            themeFilePath: this.themeFilePath,
-            paths: api.paths,
-            fileType: this.fileType,
-            template: this.template
-          }
-        ]);
-        config.plugin('ModifyChunkPlugin').use(ModifyChunkPlugin, [
-          {
-            fileType: this.fileType
-          }
-        ]);
-        const fileLoader = config.module
-          .rule('main')
-          .oneOfs.get('media')
-          .use('file-loader');
-        fileLoader.options({
-          name: '[path][name].[ext]',
-          esModule: false,
-          useRelativePath: true,
-          context: api.paths.srcDir,
-          publicPath: '/'
-        });
-
         return config;
       }
     });

diff --git a/packages/platform-web-react/src/lib/bundler/config.ts b/packages/platform-web-react/src/lib/bundler/config.ts
@@ -1,7 +1,7 @@
 import path from 'path';
 import { IApi, APIHooks } from '@shuvi/service';
 import ReactRefreshWebpackPlugin from '@next/react-refresh-utils/ReactRefreshWebpackPlugin';
-import { BUNDLER_TARGET_CLIENT } from '@shuvi/shared/lib/constants';
+import { BUNDLER_DEFAULT_TARGET } from '@shuvi/shared/lib/constants';
 import { PACKAGE_DIR } from '../paths';
 import { BUILD_CLIENT_RUNTIME_REACT_REFRESH } from '../constants';
 
@@ -58,7 +58,7 @@ export function config(api: IApi) {
         resolveLocal('react-dom')
       ]);
 
-      if (name === BUNDLER_TARGET_CLIENT && api.mode === 'development') {
+      if (name === BUNDLER_DEFAULT_TARGET && api.mode === 'development') {
         config.module
           .rule('main')
           .oneOf('js')

diff --git a/packages/platform-web/src/lib/SSR/renderer/base.ts b/packages/platform-web/src/lib/SSR/renderer/base.ts
@@ -10,13 +10,15 @@ import {
   IDocumentProps,
   ITemplateData,
   IBuiltResource,
-  CLIENT_CONTAINER_ID,
   BUILD_CLIENT_RUNTIME_MAIN,
-  BUILD_CLIENT_RUNTIME_POLYFILL,
+  BUILD_CLIENT_RUNTIME_POLYFILL
+} from '@shuvi/service';
+import {
+  CLIENT_CONTAINER_ID,
   DEV_STYLE_ANCHOR_ID,
   DEV_STYLE_HIDE_FOUC,
   CLIENT_APPDATA_ID
-} from '@shuvi/service';
+} from '@shuvi/shared/lib/constants';
 import { renderTemplate } from '../../viewTemplate';
 import { tag, stringifyTag, stringifyAttrs } from './htmlTag';
 import {

diff --git a/packages/platform-web/src/lib/SSR/renderer/ssr.ts b/packages/platform-web/src/lib/SSR/renderer/ssr.ts
@@ -1,6 +1,6 @@
 import { AppHooks, IAppData, IData } from '@shuvi/runtime-core';
 import { IRouter } from '@shuvi/router';
-import { IDENTITY_SSR_RUNTIME_PUBLICPATH } from '@shuvi/service';
+import { IDENTITY_SSR_RUNTIME_PUBLICPATH } from '@shuvi/shared/lib/constants';
 import getRuntimeConfig from '@shuvi/service/lib/lib/runtimeConfig';
 import { getPublicRuntimeConfig } from '@shuvi/service/lib/lib/getPublicRuntimeConfig';
 import { BaseRenderer } from './base';

diff --git a/packages/platform-web/src/lib/index.ts b/packages/platform-web/src/lib/index.ts
@@ -1,12 +1,35 @@
 import fse from 'fs-extra';
 import path from 'path';
-import { Api, BUILD_CLIENT_DIR, IRequest, IRuntime } from '@shuvi/service';
+import {
+  Api,
+  BUILD_DEFAULT_DIR,
+  BUILD_SERVER_DIR,
+  BUILD_SERVER_FILE_SERVER,
+  IRequest,
+  IRuntime
+} from '@shuvi/service';
+import { BUNDLER_TARGET_SERVER } from '@shuvi/shared/lib/constants';
 import { setRuntimeConfig } from '@shuvi/service/lib/lib/runtimeConfig';
+import { webpackHelpers } from '@shuvi/toolpack/lib/webpack/config';
+import {
+  createWebpackConfig,
+  IWebpackEntry
+} from '@shuvi/service/lib/bundler/config';
+
 import { initCoreResource } from './initCoreResource';
 import { resolveAppFile } from './paths';
 import { getApiRoutesMiddleware } from './apiRoute';
 import { getSSRMiddleware, renderToHTML } from './SSR';
 
+function getServerEntry(_api: Api): IWebpackEntry {
+  const { ssr } = _api.config;
+  return {
+    [BUILD_SERVER_FILE_SERVER]: [
+      resolveAppFile('entry', 'server', ssr ? 'ssr' : 'spa')
+    ]
+  };
+}
+
 async function buildHtml({
   api,
   pathname,
@@ -26,7 +49,7 @@ async function buildHtml({
 
   if (html) {
     await fse.writeFile(
-      path.resolve(api.paths.buildDir, BUILD_CLIENT_DIR, filename),
+      path.resolve(api.paths.buildDir, BUILD_DEFAULT_DIR, filename),
       html
     );
   }
@@ -40,9 +63,24 @@ const platformWeb: IRuntime = {
       setRuntimeConfig(api.config.runtimeConfig);
     }
 
+    const serverWebpackHelpers = webpackHelpers();
+    const serverChain = createWebpackConfig(api, {
+      name: BUNDLER_TARGET_SERVER,
+      node: true,
+      entry: getServerEntry(api),
+      outputDir: BUILD_SERVER_DIR,
+      webpackHelpers: serverWebpackHelpers
+    });
+
+    api.addBuildTargets({
+      chain: serverChain,
+      name: BUNDLER_TARGET_SERVER,
+      mode: api.mode,
+      helpers: serverWebpackHelpers
+    });
+
     // set application and entry
     const {
-      ssr,
       router: { history },
       target
     } = api.config;
@@ -55,15 +93,6 @@ const platformWeb: IRuntime = {
       ApplicationModule = 'create-application-history-memory';
     }
 
-    api.setServerModule({
-      application: resolveAppFile(
-        'application',
-        'server',
-        ssr ? 'create-application' : 'create-application-spa'
-      ),
-      entry: resolveAppFile('entry', 'server')
-    });
-
     api.setClientModule({
       application: resolveAppFile('application', 'client', ApplicationModule),
       entry: resolveAppFile('entry', 'client')

diff --git a/packages/platform-web/src/lib/initCoreResource.ts b/packages/platform-web/src/lib/initCoreResource.ts
@@ -3,7 +3,7 @@ import fse from 'fs-extra';
 import { parseTemplateFile } from './viewTemplate';
 import {
   Api,
-  BUILD_CLIENT_DIR,
+  BUILD_DEFAULT_DIR,
   BUILD_SERVER_DIR,
   BUILD_MANIFEST_PATH,
   BUILD_SERVER_FILE_SERVER
@@ -31,7 +31,7 @@ export function initCoreResource(api: Api) {
   api.addResoure('clientManifest', () =>
     require(path.join(
       api.paths.buildDir,
-      BUILD_CLIENT_DIR,
+      BUILD_DEFAULT_DIR,
       BUILD_MANIFEST_PATH
     ))
   );

diff --git a/packages/platform-web/src/shuvi-app/entry/server/spa.ts b/packages/platform-web/src/shuvi-app/entry/server/spa.ts
@@ -0,0 +1,7 @@
+// This is the shuvi server-side main module exports collection
+import * as application from '../../application/server/create-application-spa';
+import * as server from '@shuvi/app/user/server';
+import * as document from '@shuvi/app/user/document';
+import { default as apiRoutes } from '@shuvi/app/core/apiRoutes';
+export { server, document, application, apiRoutes };
+export { view } from '@shuvi/app/core/platform';
diff --git a/...m-web/src/shuvi-app/entry/server/index.ts → ...orm-web/src/shuvi-app/entry/server/ssr.ts b/...m-web/src/shuvi-app/entry/server/index.ts → ...orm-web/src/shuvi-app/entry/server/ssr.ts
@@ -1,7 +1,7 @@
 // This is the shuvi server-side main module exports collection
+import * as application from '../../application/server/create-application';
 import * as server from '@shuvi/app/user/server';
 import * as document from '@shuvi/app/user/document';
-import * as application from '@shuvi/app/core/server/application';
 import { default as apiRoutes } from '@shuvi/app/core/apiRoutes';
 export { server, document, application, apiRoutes };
 export { view } from '@shuvi/app/core/platform';