Merge branch 'umijs:master' into master

docs/docs/blog/legacy-browser.en-US.md

@@ -82,7 +82,7 @@ export default {
 
 export default {
   headScripts: [
-    'http://polyfill.alicdn.com/v3/polyfill.min.js', // or https://polyfill.io/v3/polyfill.min.js
+    'http://polyfill.alicdn.com/v3/polyfill.min.js', // or https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js
   ],
   legacy: {},
 };
@@ -94,7 +94,7 @@ export default {
 | :----------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | CDN 引入           | 以 cdn 形式引入 **script 形式且前置的** 、目标浏览器环境缺少的 polyfill js 文件，如 [es6-shim](https://github.com/paulmillr/es6-shim) 。                                                                                                                                                                                                              |
 | 人工 core-js       | 利用 [core-js](https://github.com/zloirock/core-js) 系工具，如通过 [core-js-builder](https://github.com/zloirock/core-js/tree/master/packages/core-js-builder) 构建自己需要的 polyfill 产物，再以 **前置 script 脚本** 形式引入项目。                                                                                                                 |
-| 动态 polyfill 服务 | 使用根据当前浏览器请求 UA 动态下发所需 polyfill 的服务，比如 [polyfill.io](https://polyfill.io/v3/polyfill.min.js) ，考虑到速度，可使用国内的 [alicdn polyfill.io](http://polyfill.alicdn.com/v3/polyfill.min.js) 服务。另外，你还可以使用 [polyfill-service](https://github.com/Financial-Times/polyfill-service) 自建相同的动态 polyfill 下发服务。 |
+| 动态 polyfill 服务 | 使用根据当前浏览器请求 UA 动态下发所需 polyfill 的服务，比如 [polyfill.io (alicdn)](http://polyfill.alicdn.com/v3/polyfill.min.js) 或 [polyfill.io (CloudFlare)](https://cdnjs.cloudflare.com/polyfill/) 服务。另外，你还可以使用 [polyfill-service](https://github.com/cdnjs/polyfill-service) 自建相同的动态 polyfill 下发服务。 |
 
 注：
 

docs/docs/blog/legacy-browser.md

@@ -94,7 +94,7 @@ export default {
 | :----------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | CDN 引入           | 以 cdn 形式引入 **script 形式且前置的** 、目标浏览器环境缺少的 polyfill js 文件，如 [es6-shim](https://github.com/paulmillr/es6-shim) 。                                                                                                                                                                                                              |
 | 人工 core-js       | 利用 [core-js](https://github.com/zloirock/core-js) 系工具，如通过 [core-js-builder](https://github.com/zloirock/core-js/tree/master/packages/core-js-builder) 构建自己需要的 polyfill 产物，再以 **前置 script 脚本** 形式引入项目。                                                                                                                 |
-| 动态 polyfill 服务 | 使用根据当前浏览器请求 UA 动态下发所需 polyfill 的服务，比如 [polyfill.io (alicdn)](http://polyfill.alicdn.com/v3/polyfill.min.js) 或 [polyfill.io (CloudFlare)](https://cdnjs.cloudflare.com/polyfill/) 服务。另外，你还可以使用 [polyfill-service](https://github.com/polyfillpolyfill/polyfill-service) 自建相同的动态 polyfill 下发服务。 |
+| 动态 polyfill 服务 | 使用根据当前浏览器请求 UA 动态下发所需 polyfill 的服务，比如 [polyfill.io (alicdn)](http://polyfill.alicdn.com/v3/polyfill.min.js) 或 [polyfill.io (CloudFlare)](https://cdnjs.cloudflare.com/polyfill/) 服务。另外，你还可以使用 [polyfill-service](https://github.com/cdnjs/polyfill-service) 自建相同的动态 polyfill 下发服务。 |
 
 注：
 

examples/max/package.json

@@ -19,8 +19,8 @@
     "@umijs/max": "workspace:*",
     "antd": "^4.23.2",
     "dayjs": "^1.11.7",
-    "react": "18.1.0",
-    "react-dom": "18.1.0"
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
   },
   "devDependencies": {
     "cross-env": "^7.0.3",

examples/mf-host/package.json

@@ -19,8 +19,8 @@
   },
   "dependencies": {
     "@umijs/max": "workspace:*",
-    "react": "18.1.0",
-    "react-dom": "18.1.0"
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
   },
   "devDependencies": {
     "cross-env": "^7.0.3",

examples/mf-remote/package.json

@@ -12,8 +12,8 @@
   },
   "dependencies": {
     "@umijs/max": "workspace:*",
-    "react": "18.1.0",
-    "react-dom": "18.1.0"
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
   },
   "devDependencies": {
     "cross-env": "^7.0.3",

examples/qiankun-master/package.json

@@ -10,8 +10,8 @@
   "dependencies": {
     "@umijs/max": "workspace:*",
     "qiankun": "^2.10.1",
-    "react": "18.1.0",
-    "react-dom": "18.1.0"
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
   },
   "devDependencies": {
     "cross-env": "^7.0.3"

examples/qiankun-slave-app2/package.json

@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@umijs/max": "workspace:*",
-    "react": "18.1.0",
-    "react-dom": "18.1.0"
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
   }
 }

examples/qiankun-slave/package.json

@@ -18,8 +18,8 @@
   },
   "dependencies": {
     "@umijs/max": "workspace:*",
-    "react": "18.1.0",
-    "react-dom": "18.1.0"
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
   },
   "devDependencies": {
     "cross-env": "^7.0.3",

examples/ssr-demo/.umirc.ts

@@ -1,10 +1,27 @@
 export default {
   svgr: {},
   hash: true,
+  mfsu: false,
   routePrefetch: {},
   manifest: {},
   clientLoader: {},
+  mako: {
+    plugins: [
+      {
+        load: () => {},
+      },
+    ],
+  },
   ssr: {
-    serverBuildPath: './umi.server.js',
+    builder: 'mako',
   },
+  exportStatic: {},
+  styles: [`body { color: red; }`],
+
+  metas: [
+    {
+      name: 'test',
+      content: 'content',
+    },
+  ],
 };

examples/ssr-demo/mako.config.json

@@ -0,0 +1,6 @@
+{
+  "optimization": {
+    "skipModules": true,
+    "concatenateModules": false
+  }
+}

examples/ssr-demo/package.json

@@ -9,6 +9,8 @@
     "start:prod": "node ./production-server.js"
   },
   "dependencies": {
+    "@ant-design/cssinjs": "^1.18.5",
+    "antd": "^5",
     "express": "4.18.2",
     "umi": "workspace:*"
   }

examples/ssr-demo/src/layouts/index.tsx

@@ -0,0 +1,23 @@
+import { createCache, extractStyle, StyleProvider } from '@ant-design/cssinjs';
+import { useState } from 'react';
+import { Outlet, useServerInsertedHTML } from 'umi';
+
+export default function Layout() {
+  const [cssCache] = useState(() => createCache());
+
+  useServerInsertedHTML(() => {
+    const style = extractStyle(cssCache, { plain: true });
+    return (
+      <style
+        id="antd-cssinjs"
+        dangerouslySetInnerHTML={{ __html: style }}
+      ></style>
+    );
+  });
+
+  return (
+    <StyleProvider cache={cssCache}>
+      <Outlet />
+    </StyleProvider>
+  );
+}

examples/ssr-demo/src/pages/index.tsx

@@ -1,8 +1,12 @@
+import { Input } from 'antd';
+import { useId } from 'react';
 import {
+  ClientLoader,
   Link,
   MetadataLoader,
   ServerLoader,
   useClientLoaderData,
+  useLoaderData,
   useServerInsertedHTML,
   useServerLoaderData,
 } from 'umi';
@@ -20,18 +24,29 @@ import umiLogo from './umi.png';
 export default function HomePage() {
   const clientLoaderData = useClientLoaderData();
   const serverLoaderData = useServerLoaderData<typeof serverLoader>();
+  const loaderData = useLoaderData<typeof serverLoader>();
 
   useServerInsertedHTML(() => {
-    return <div>inserted html</div>;
+    return (
+      <style
+        dangerouslySetInnerHTML={{
+          __html: `.server_inserted_style { color: #1677ff }`,
+        }}
+      ></style>
+    );
   });
 
+  const id = useId();
+
   return (
     <div>
       <h1 className="title">Hello~</h1>
+      <p className="server_inserted_style">id: {id}</p>
       <p className={styles.blue}>This is index.tsx</p>
       <p className={cssStyle.title}>I should be pink</p>
       <p className={cssStyle.blue}>I should be cyan</p>
       <Button />
+      <Input placeholder="这个样式不应该闪烁" />
       <img src={bigImage} alt="" />
       <img src={umiLogo} alt="umi" />
       <Link to="/users/user">/users/user</Link>
@@ -43,19 +58,21 @@ export default function HomePage() {
       </div>
       <p>client loader data: {JSON.stringify(clientLoaderData)}</p>
       <p>server loader data: {JSON.stringify(serverLoaderData)}</p>
+      <p>merge loader data: {JSON.stringify(loaderData)}</p>
     </div>
   );
 }
 
-export async function clientLoader() {
+export const clientLoader: ClientLoader = async ({}) => {
   await new Promise((resolve) => setTimeout(resolve, Math.random() * 1000));
-  return { message: 'data from client loader of index.tsx' };
-}
+  return { clientMessage: 'data from client loader of index.tsx' };
+};
+clientLoader.hydrate = true;
 
 export const serverLoader: ServerLoader = async (req) => {
-  const url = req!.request.url;
+  const url = req?.request?.url;
   await new Promise((resolve) => setTimeout(resolve, Math.random() * 1000));
-  return { message: `data from server loader of index.tsx, url: ${url}` };
+  return { serverMessage: `data from server loader of index.tsx, url: ${url}` };
 };
 
 // SEO-设置页面的TDK

lerna.json

@@ -1,4 +1,4 @@
 {
-  "version": "4.2.15",
+  "version": "4.3.0",
   "workspaces": ["packages/*"]
 }

package.json

@@ -66,8 +66,8 @@
     "@types/jest": "^29.2.5",
     "@types/node": "^18.11.18",
     "@types/qs": "^6.9.7",
-    "@types/react": "^18.0.26",
-    "@types/react-dom": "^18.0.10",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
     "@types/resolve": "^1.20.2",
     "@types/rimraf": "3.0.2",
     "@types/tunnel": "^0.0.3",
@@ -101,8 +101,8 @@
     "prettier-plugin-organize-imports": "^3.2.2",
     "prettier-plugin-packagejson": "^2.4.3",
     "qs": "^6.11.0",
-    "react": "18.1.0",
-    "react-dom": "18.1.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
     "react-text-loop-next": "0.0.3",
     "regenerator-runtime": "^0.13.11",
     "resolve": "^1.22.0",
@@ -142,8 +142,8 @@
       ]
     },
     "overrides": {
-      "browserslist": "$browserslist",
-      "@parcel/watcher": "2.1.0"
+      "@parcel/watcher": "2.1.0",
+      "browserslist": "$browserslist"
     }
   },
   "_local": "This flag is used to check if the development in local, Please do not delete."

packages/ast/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/ast",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "@umijs/ast",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/ast#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/babel-preset-umi/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/babel-preset-umi",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "Official babel preset for umi.",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/babel-preset-umi#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/bundler-esbuild/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/bundler-esbuild",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "@umijs/bundler-esbuild",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/bundler-esbuild#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/bundler-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/bundler-utils",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/bundler-utils#readme",
   "bugs": "https://github.com/umijs/umi/issues",
   "repository": {

packages/bundler-vite/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/bundler-vite",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "@umijs/bundler-vite",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/bundler-vite#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/bundler-webpack/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/bundler-webpack",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "@umijs/bundler-webpack",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/bundler-webpack#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/bundler-webpack/src/config/definePlugin.test.ts

@@ -13,6 +13,7 @@ test('normal', () => {
       NODE_ENV: '"test"',
       PUBLIC_PATH: '"/"',
     },
+    'process.env.SSR_MANIFEST': 'process.env.SSR_MANIFEST',
   });
 });
 
@@ -31,6 +32,7 @@ test('env variables', () => {
       UMI_APP_FOO: '"BAR"',
       PUBLIC_PATH: '"/"',
     },
+    'process.env.SSR_MANIFEST': 'process.env.SSR_MANIFEST',
   });
 });
 

packages/bundler-webpack/src/config/definePlugin.ts

@@ -66,6 +66,7 @@ export function resolveDefine(opts: IOpts) {
 
   return {
     'process.env': env,
+    'process.env.SSR_MANIFEST': 'process.env.SSR_MANIFEST',
     ...define,
   };
 }

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/core",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/core#readme",
   "bugs": "https://github.com/umijs/umi/issues",
   "repository": {

packages/create-umi/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-umi",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "create-umi",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/create-umi#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/lint/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/lint",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "@umijs/lint",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/lint#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/max/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/max",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "@umijs/max",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/max#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/mfsu/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/mfsu",
-  "version": "4.2.15",
+  "version": "4.3.0",
   "description": "@umijs/mfsu",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/mfsu#readme",
   "bugs": "https://github.com/umijs/umi/issues",

packages/mfsu/src/mfsu/strategyStaticAnalyze.ts

@@ -1,11 +1,11 @@
 import { logger, printHelp, winPath } from '@umijs/utils';
+import type { Configuration } from 'webpack';
 import { checkMatch } from '../babelPlugins/awaitImport/checkMatch';
 import mfImport from '../babelPlugins/awaitImport/MFImport';
 import { StaticDepInfo } from '../staticDepInfo/staticDepInfo';
+import { extractBabelPluginImportOptions } from '../utils/webpackUtils';
 import { IBuildDepPluginOpts } from '../webpackPlugins/buildDepPlugin';
 import type { IMFSUStrategy, MFSU } from './mfsu';
-import type { Configuration } from 'webpack';
-import { extractBabelPluginImportOptions } from '../utils/webpackUtils';
 
 export class StaticAnalyzeStrategy implements IMFSUStrategy {
   private readonly mfsu: MFSU;