ssr-plugin-react 6.2.17 → 6.2.18

package/CHANGELOG.md

@@ -1,3 +1,25 @@
+## [6.2.18](https://github.com/zhangyuang/ssr/compare/plugin-react@6.2.17...plugin-react@6.2.18) (2022-05-13)
+
+
+### Bug Fixes
+
+* add prefix output to window.prefix in csr mode ([#197](https://github.com/zhangyuang/ssr/issues/197)) ([479bb3d](https://github.com/zhangyuang/ssr/commit/479bb3df67d7da5635939a4219b5f5f9a40b5508))
+* build html ([83be7be](https://github.com/zhangyuang/ssr/commit/83be7be185985a5dcbb9b8e846a5e2b14b94c1b0))
+* build html ([59a8d7f](https://github.com/zhangyuang/ssr/commit/59a8d7f31bed703601e753d02db49ea5a0f93054))
+* plugin-react without dynamic mode ([487cc84](https://github.com/zhangyuang/ssr/commit/487cc84188640aab13c27214df758da0d19e4368))
+
+
+### Features
+
+* add .vue to defaultWhiteList ([dbabfa2](https://github.com/zhangyuang/ssr/commit/dbabfa2864ec0a5487aadc31286da5630a8603fc))
+* add `turbo` ([#196](https://github.com/zhangyuang/ssr/issues/196)) ([2be17bb](https://github.com/zhangyuang/ssr/commit/2be17bba5d80610b97b3813b3d4fe9579f88e5c3))
+* babelExtraModule support vue ([06251e7](https://github.com/zhangyuang/ssr/commit/06251e716678e1f882f06f68f72c518a341de0d7))
+* babelExtraModule support vue ([513073d](https://github.com/zhangyuang/ssr/commit/513073ddcecbb728d34eae233686a93d63355e00))
+* update turbo ([9ee14f5](https://github.com/zhangyuang/ssr/commit/9ee14f59359187e35f4ef990998846ac3847347b))
+* use terser minify plugin-react server bundle ([0a3c7fe](https://github.com/zhangyuang/ssr/commit/0a3c7fe61908fe24bcb2d8c6394daf2afd18ba82))
+
+
+
 ## [6.2.17](https://github.com/zhangyuang/ssr/compare/plugin-react@6.2.16...plugin-react@6.2.17) (2022-05-05)
 
 

package/cjs/config/server.js

@@ -8,6 +8,7 @@ const base_1 = require("./base");
 const getServerWebpack = (chain) => {
     const config = (0, ssr_server_utils_1.loadConfig)();
     const { isDev, cwd, getOutput, chainServerConfig, whiteList, chunkName } = config;
+    const shouldUseSourceMap = isDev || Boolean(process.env.GENERATE_SOURCEMAP);
     (0, base_1.getBaseConfig)(chain, true);
     chain.devtool(isDev ? 'inline-source-map' : false);
     chain.target('node');
@@ -25,6 +26,18 @@ const getServerWebpack = (chain) => {
         // externals Dir contains example/xxx/node_modules ssr/node_modules
         modulesDir
     }));
+    if (!isDev) {
+        chain.optimization.minimizer('terser')
+            .use((0, ssr_server_utils_1.loadModuleFromFramework)('terser-webpack-plugin'), [{
+                terserOptions: {
+                    keep_fnames: true
+                },
+                extractComments: false,
+                parallel: true,
+                cache: true,
+                sourceMap: shouldUseSourceMap
+            }]);
+    }
     chain.when(isDev, () => {
         chain.watch(true);
     });

package/cjs/entry/server-entry.js

@@ -42,7 +42,7 @@ const serverRender = async (ctx, config) => {
         injectScript
     };
     const isCsr = !!(mode === 'csr' || ((_a = ctx.request.query) === null || _a === void 0 ? void 0 : _a.csr));
-    const Component = isCsr ? React.Fragment : (await component()).default;
+    const Component = isCsr ? React.Fragment : (component.name === 'dynamicComponent' ? (await component()).default : component);
     if (isCsr) {
         (0, ssr_server_utils_1.logGreen)(`Current path ${path} use csr render mode`);
     }
@@ -63,7 +63,7 @@ const serverRender = async (ctx, config) => {
         }
     }
     const combineData = isCsr ? null : Object.assign(state !== null && state !== void 0 ? state : {}, layoutFetchData !== null && layoutFetchData !== void 0 ? layoutFetchData : {}, fetchData !== null && fetchData !== void 0 ? fetchData : {});
-    const injectState = isCsr ? null : React.createElement("script", { dangerouslySetInnerHTML: {
+    const injectState = isCsr ? React.createElement("script", { dangerouslySetInnerHTML: { __html: `window.prefix="${prefix}"` } }) : React.createElement("script", { dangerouslySetInnerHTML: {
             __html: `window.__USE_SSR__=true; window.__INITIAL_DATA__ =${(0, ssr_serialize_javascript_1.serialize)(combineData)}; window.prefix="${prefix}";${clientPrefix && `window.clientPrefix="${clientPrefix}"`}`
         } });
     return (React.createElement(react_router_dom_1.StaticRouter, { location: ctx.request.url },

package/cjs/tools/vite.js

@@ -39,6 +39,9 @@ const serverConfig = {
         (_g = (_f = viteConfig === null || viteConfig === void 0 ? void 0 : viteConfig()) === null || _f === void 0 ? void 0 : _f.server) === null || _g === void 0 ? void 0 : _g.extraPlugin,
         (0, vite_plugin_style_import_1.default)(styleImportConfig)
     ],
+    esbuild: {
+        keepNames: true
+    },
     build: {
         ssr: reactServerEntry,
         outDir: serverOutPut,

package/esm/config/server.js

@@ -1,10 +1,11 @@
 import { join } from 'path';
-import { loadConfig, getLocalNodeModules, nodeExternals } from 'ssr-server-utils';
+import { loadConfig, getLocalNodeModules, nodeExternals, loadModuleFromFramework } from 'ssr-server-utils';
 import * as webpack from 'webpack';
 import { getBaseConfig } from './base';
 const getServerWebpack = (chain) => {
     const config = loadConfig();
     const { isDev, cwd, getOutput, chainServerConfig, whiteList, chunkName } = config;
+    const shouldUseSourceMap = isDev || Boolean(process.env.GENERATE_SOURCEMAP);
     getBaseConfig(chain, true);
     chain.devtool(isDev ? 'inline-source-map' : false);
     chain.target('node');
@@ -22,6 +23,18 @@ const getServerWebpack = (chain) => {
         // externals Dir contains example/xxx/node_modules ssr/node_modules
         modulesDir
     }));
+    if (!isDev) {
+        chain.optimization.minimizer('terser')
+            .use(loadModuleFromFramework('terser-webpack-plugin'), [{
+                terserOptions: {
+                    keep_fnames: true
+                },
+                extractComments: false,
+                parallel: true,
+                cache: true,
+                sourceMap: shouldUseSourceMap
+            }]);
+    }
     chain.when(isDev, () => {
         chain.watch(true);
     });

package/esm/entry/server-entry.js

@@ -39,7 +39,7 @@ const serverRender = async (ctx, config) => {
         injectScript
     };
     const isCsr = !!(mode === 'csr' || ((_a = ctx.request.query) === null || _a === void 0 ? void 0 : _a.csr));
-    const Component = isCsr ? React.Fragment : (await component()).default;
+    const Component = isCsr ? React.Fragment : (component.name === 'dynamicComponent' ? (await component()).default : component);
     if (isCsr) {
         logGreen(`Current path ${path} use csr render mode`);
     }
@@ -60,7 +60,7 @@ const serverRender = async (ctx, config) => {
         }
     }
     const combineData = isCsr ? null : Object.assign(state !== null && state !== void 0 ? state : {}, layoutFetchData !== null && layoutFetchData !== void 0 ? layoutFetchData : {}, fetchData !== null && fetchData !== void 0 ? fetchData : {});
-    const injectState = isCsr ? null : React.createElement("script", { dangerouslySetInnerHTML: {
+    const injectState = isCsr ? React.createElement("script", { dangerouslySetInnerHTML: { __html: `window.prefix="${prefix}"` } }) : React.createElement("script", { dangerouslySetInnerHTML: {
             __html: `window.__USE_SSR__=true; window.__INITIAL_DATA__ =${serialize(combineData)}; window.prefix="${prefix}";${clientPrefix && `window.clientPrefix="${clientPrefix}"`}`
         } });
     return (React.createElement(StaticRouter, { location: ctx.request.url },

package/esm/tools/vite.js

@@ -36,6 +36,9 @@ const serverConfig = {
         (_g = (_f = viteConfig === null || viteConfig === void 0 ? void 0 : viteConfig()) === null || _f === void 0 ? void 0 : _f.server) === null || _g === void 0 ? void 0 : _g.extraPlugin,
         styleImport(styleImportConfig)
     ],
+    esbuild: {
+        keepNames: true
+    },
     build: {
         ssr: reactServerEntry,
         outDir: serverOutPut,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ssr-plugin-react",
-  "version": "6.2.17",
+  "version": "6.2.18",
   "description": "plugin-react for ssr",
   "main": "./cjs/index.js",
   "module": "./esm/index.js",

package/src/config/server.ts

@@ -1,5 +1,5 @@
 import { join } from 'path'
-import { loadConfig, getLocalNodeModules, nodeExternals } from 'ssr-server-utils'
+import { loadConfig, getLocalNodeModules, nodeExternals, loadModuleFromFramework } from 'ssr-server-utils'
 import * as WebpackChain from 'webpack-chain'
 import * as webpack from 'webpack'
 import { getBaseConfig } from './base'
@@ -7,6 +7,7 @@ import { getBaseConfig } from './base'
 const getServerWebpack = (chain: WebpackChain) => {
   const config = loadConfig()
   const { isDev, cwd, getOutput, chainServerConfig, whiteList, chunkName } = config
+  const shouldUseSourceMap = isDev || Boolean(process.env.GENERATE_SOURCEMAP)
   getBaseConfig(chain, true)
   chain.devtool(isDev ? 'inline-source-map' : false)
   chain.target('node')
@@ -25,7 +26,18 @@ const getServerWebpack = (chain: WebpackChain) => {
     // externals Dir contains example/xxx/node_modules ssr/node_modules
     modulesDir
   }))
-
+  if (!isDev) {
+    chain.optimization.minimizer('terser')
+      .use(loadModuleFromFramework('terser-webpack-plugin'), [{
+        terserOptions: {
+          keep_fnames: true
+        },
+        extractComments: false,
+        parallel: true,
+        cache: true,
+        sourceMap: shouldUseSourceMap
+      }])
+  }
   chain.when(isDev, () => {
     chain.watch(true)
   })

package/src/entry/server-entry.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { StaticRouter } from 'react-router-dom'
 import { findRoute, getManifest, logGreen, normalizePath, getAsyncCssChunk, getAsyncJsChunk, reactRefreshFragment } from 'ssr-server-utils'
-import { ISSRContext, IConfig, ReactRoutesType, ReactESMFeRouteItem } from 'ssr-types-react'
+import { ISSRContext, IConfig, ReactRoutesType, ReactESMPreloadFeRouteItem, DynamicFC, StaticFC } from 'ssr-types-react'
 import { serialize } from 'ssr-serialize-javascript'
 // @ts-expect-error
 import { STORE_CONTEXT as Context } from '_build/create-context'
@@ -12,7 +12,7 @@ const { FeRoutes, layoutFetch, state, Layout } = Routes as ReactRoutesType
 const serverRender = async (ctx: ISSRContext, config: IConfig): Promise<React.ReactElement> => {
   const { mode, parallelFetch, prefix, isVite, isDev, clientPrefix } = config
   const path = normalizePath(ctx.request.path, prefix)
-  const routeItem = findRoute<ReactESMFeRouteItem>(FeRoutes, path)
+  const routeItem = findRoute<ReactESMPreloadFeRouteItem>(FeRoutes, path)
 
   if (!routeItem) {
     throw new Error(`
@@ -46,7 +46,7 @@ const serverRender = async (ctx: ISSRContext, config: IConfig): Promise<React.Re
   }
 
   const isCsr = !!(mode === 'csr' || ctx.request.query?.csr)
-  const Component = isCsr ? React.Fragment : (await component()).default
+  const Component = isCsr ? React.Fragment : (component.name === 'dynamicComponent' ? (await (component as DynamicFC)()).default : component as StaticFC)
 
   if (isCsr) {
     logGreen(`Current path ${path} use csr render mode`)
@@ -68,7 +68,7 @@ const serverRender = async (ctx: ISSRContext, config: IConfig): Promise<React.Re
     }
   }
   const combineData = isCsr ? null : Object.assign(state ?? {}, layoutFetchData ?? {}, fetchData ?? {})
-  const injectState = isCsr ? null : <script dangerouslySetInnerHTML={{
+  const injectState = isCsr ? <script dangerouslySetInnerHTML={{ __html: `window.prefix="${prefix}"` }} /> : <script dangerouslySetInnerHTML={{
     __html: `window.__USE_SSR__=true; window.__INITIAL_DATA__ =${serialize(combineData)}; window.prefix="${prefix}";${clientPrefix && `window.clientPrefix="${clientPrefix}"`}`
   }} />
 

package/src/tools/vite.ts

@@ -35,6 +35,9 @@ const serverConfig: UserConfig = {
     viteConfig?.()?.server?.extraPlugin,
     styleImport(styleImportConfig)
   ],
+  esbuild: {
+    keepNames: true
+  },
   build: {
     ssr: reactServerEntry,
     outDir: serverOutPut,