Merge 34659a428e into 22b10c0d1c

* feat: support custom props when render document

* Update packages/runtime/src/types.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update packages/runtime/src/renderDocument.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* fix: test case

* Update runServerApp.tsx

* fix: optimize props

* chore: optimize code

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

packages/ice/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 3.6.3
+
+### Patch Changes
+
+- cc0792b0: fix: minify server bundle when build in prod
+- Updated dependencies [cc0792b0]
+  - @ice/runtime@1.5.3
+
 ## 3.6.2
 
 ### Patch Changes

packages/ice/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ice/app",
-  "version": "3.6.2",
+  "version": "3.6.3",
   "description": "provide scripts and configuration used by web framework ice",
   "type": "module",
   "main": "./esm/index.js",

packages/ice/src/service/serverCompiler.ts

@@ -184,6 +184,7 @@ export function createServerCompiler(options: Options) {
       // while it is not recommended
       loader: { '.js': 'jsx' },
       jsx: 'automatic',
+      minify: !dev,
       sourcemap: typeof sourceMap === 'boolean'
         // Transform sourceMap for esbuild.
         ? sourceMap : (sourceMap.includes('inline') ? 'inline' : !!sourceMap),

packages/ice/templates/core/entry.server.ts.ejs

@@ -59,6 +59,7 @@ interface RenderOptions {
   publicPath?: string;
   serverData?: any;
   streamOptions?: RenderToPipeableStreamOptions;
+  documentProps?: Record<string, unknown>;
 }
 
 export async function renderToHTML(requestContext, options: RenderOptions = {}) {

packages/miniapp-react-dom/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @ice/miniapp-react-dom
 
+## 1.1.4
+
+### Patch Changes
+
+- @ice/miniapp-runtime@1.2.4
+
 ## 1.1.3
 
 ### Patch Changes

packages/miniapp-react-dom/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ice/miniapp-react-dom",
-  "version": "1.1.3",
+  "version": "1.1.4",
   "description": "like react-dom, but for miniapps.",
   "type": "module",
   "types": "./esm/index.d.ts",

packages/miniapp-runtime/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## 1.2.4
+
+### Patch Changes
+
+- Updated dependencies [cc0792b0]
+  - @ice/runtime@1.5.3
+
 ## 1.2.3
 
 ### Patch Changes

packages/miniapp-runtime/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ice/miniapp-runtime",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "ice runtime for miniapps.",
   "type": "module",
   "types": "./esm/index.d.ts",

packages/plugin-i18n/package.json

@@ -56,8 +56,8 @@
     "webpack-dev-server": "4.15.0"
   },
   "peerDependencies": {
-    "@ice/app": "^3.6.2",
+    "@ice/app": "^3.6.3",
-    "@ice/runtime": "^1.5.2"
+    "@ice/runtime": "^1.5.3"
   },
   "publishConfig": {
     "access": "public"

packages/plugin-miniapp/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## 1.2.5
+
+### Patch Changes
+
+- @ice/miniapp-runtime@1.2.4
+- @ice/miniapp-react-dom@1.1.4
+
 ## 1.2.4
 
 ### Patch Changes

packages/plugin-miniapp/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ice/plugin-miniapp",
-  "version": "1.2.4",
+  "version": "1.2.5",
   "description": "ice.js plugin for miniapp.",
   "license": "MIT",
   "type": "module",
@@ -50,8 +50,8 @@
     "sax": "^1.2.4"
   },
   "devDependencies": {
-    "@ice/app": "^3.6.2",
+    "@ice/app": "^3.6.3",
-    "@ice/runtime": "^1.5.2",
+    "@ice/runtime": "^1.5.3",
     "webpack": "^5.88.0"
   },
   "repository": {

packages/plugin-react-query/CHANGELOG.md

@@ -0,0 +1,5 @@
+# @ice/plugin-react-query
+
+## 1.0.0
+
+- Initial release

packages/plugin-react-query/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@ice/plugin-react-query",
+  "version": "1.0.0",
+  "description": "React Query plugin for ice.",
+  "license": "MIT",
+  "type": "module",
+  "main": "./esm/index.js",
+  "types": "./esm/index.d.ts",
+  "files": [
+    "esm",
+    "!esm/**/*.map",
+    "*.d.ts"
+  ],
+  "dependencies": {
+    "@tanstack/react-query": "^5.50.1",
+    "@tanstack/react-query-devtools": "^5.50.1"
+  },
+  "devDependencies": {
+    "@ice/app": "^3.4.9",
+    "@ice/runtime": "^1.4.8",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "@tanstack/query-devtools": "^5.50.1"
+  },
+  "repository": {
+    "type": "http",
+    "url": "https://github.com/alibaba/ice/tree/master/packages/plugin-request"
+  },
+  "scripts": {
+    "watch": "tsc -w --sourceMap",
+    "build": "tsc"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

packages/plugin-react-query/src/index.tsx

@@ -0,0 +1,47 @@
+import { createRequire } from 'module';
+import type { Plugin } from '@ice/app/types';
+
+const require = createRequire(import.meta.url);
+const PLUGIN_NAME = '@ice/plugin-react-query';
+
+const plugin: Plugin<void> = () => {
+  return {
+    name: PLUGIN_NAME,
+    setup: ({ generator, onGetConfig }) => {
+      generator.addExport({
+        specifier: [
+          // Core API export from @tanstack/react-query
+          'useQuery',
+          'useMutation',
+          'useQueryClient',
+          'useMutationState',
+          'useSuspenseQuery',
+          'useSuspenseInfiniteQuery',
+          'useSuspenseQueries',
+          'queryOptions',
+          'infiniteQueryOptions',
+          'QueryClientProvider',
+          'useQueryClient',
+          'QueryErrorResetBoundary',
+          'useQueryErrorResetBoundary',
+          'useIsRestoring',
+          'IsRestoringProvider',
+        ],
+        source: '@tanstack/react-query',
+        type: false,
+      });
+      onGetConfig((config) => {
+        // Add alias for react-query and react-query-devtools to avoid mismatching versions.
+        config.alias = {
+          ...config.alias,
+          '@tanstack/react-query': require.resolve('@tanstack/react-query'),
+          '@tanstack/react-query-devtools': require.resolve('@tanstack/react-query-devtools'),
+        };
+      });
+    },
+    runtime: `${PLUGIN_NAME}/runtime`,
+    staticRuntime: true,
+  };
+};
+
+export default plugin;

packages/plugin-react-query/src/runtime.tsx

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
+import type { RuntimePlugin } from '@ice/runtime/types';
+import type { ReactQueryConfig } from './types';
+
+const EXPORT_CONFIG_NAME = 'reactQueryConfig';
+
+const runtime: RuntimePlugin = ({ addProvider, appContext }) => {
+  const { appExport } = appContext;
+  const reactQueryConfig = appExport[EXPORT_CONFIG_NAME] as ReactQueryConfig;
+  const queryClient = new QueryClient({
+    ...(reactQueryConfig?.queryClientConfig || {}),
+    defaultOptions: {
+      queries: {
+        refetchOnWindowFocus: false,
+        retry: false,
+        ...(reactQueryConfig?.queryClientConfig.defaultOptions?.queries || {}),
+      },
+    },
+  });
+  const ProviderWrapper = ({ children }) => {
+    return (
+      <QueryClientProvider client={queryClient}>
+        {children}
+        { reactQueryConfig?.devTools &&
+          <ReactQueryDevtools
+            {...(reactQueryConfig.devTools || {})}
+          /> }
+      </QueryClientProvider>
+    );
+  };
+  addProvider(ProviderWrapper);
+};
+
+export default runtime;

packages/plugin-react-query/src/types.ts

@@ -0,0 +1,17 @@
+import type { QueryClientConfig, QueryClient } from '@tanstack/react-query';
+import type { DevtoolsButtonPosition, DevtoolsPosition, DevToolsErrorType } from '@tanstack/query-devtools';
+
+interface DevtoolsOptions {
+  initialIsOpen?: boolean;
+  buttonPosition?: DevtoolsButtonPosition;
+  position?: DevtoolsPosition;
+  client?: QueryClient;
+  errorTypes?: Array<DevToolsErrorType>;
+  styleNonce?: string;
+  shadowDOMTarget?: ShadowRoot;
+}
+
+export interface ReactQueryConfig {
+  devTools?: DevtoolsOptions;
+  queryClientConfig?: QueryClientConfig;
+}

packages/plugin-react-query/tsconfig.json

@@ -0,0 +1,10 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "baseUrl": "./",
+    "rootDir": "src",
+    "outDir": "esm",
+    "jsx": "react"
+  },
+  "include": ["src"]
+}

packages/runtime/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @ice/runtime
 
+## 1.5.3
+
+### Patch Changes
+
+- cc0792b0: feat: support custom props when render document
+
 ## 1.5.2
 
 ### Patch Changes

packages/runtime/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ice/runtime",
-  "version": "1.5.2",
+  "version": "1.5.3",
   "description": "Runtime module for ice.js",
   "type": "module",
   "types": "./esm/index.d.ts",

packages/runtime/src/renderDocument.tsx

@@ -45,6 +45,7 @@ export function renderDocument(options: RenderDocumentOptions): Response {
     basename,
     routesConfig = {},
     serverData,
+    documentProps,
   } = renderOptions;
 
   const appData = null;
@@ -84,7 +85,7 @@ export function renderDocument(options: RenderDocumentOptions): Response {
     <AppContextProvider value={appContext}>
       <DocumentContextProvider value={documentContext}>
         {
-          Document && <Document pagePath={routePath} />
+          Document && <Document pagePath={routePath} {...documentProps} />
         }
       </DocumentContextProvider>
     </AppContextProvider>,

packages/runtime/src/runServerApp.tsx

@@ -283,7 +283,7 @@ async function renderServerEntry(
     renderOptions,
   }: RenderServerEntry,
 ): Promise<Response> {
-  const { Document } = renderOptions;
+  const { Document, documentProps } = renderOptions;
   const appContext = runtime.getAppContext();
   const { routes, routePath, loaderData, basename } = appContext;
   const AppRuntimeProvider = runtime.composeAppProvider() || React.Fragment;
@@ -307,7 +307,7 @@ async function renderServerEntry(
       <AppRuntimeProvider>
         <DocumentContextProvider value={documentContext}>
           {
-            Document && <Document pagePath={routePath} />
+            Document && <Document pagePath={routePath} {...documentProps} />
           }
         </DocumentContextProvider>
       </AppRuntimeProvider>

packages/runtime/src/types.ts

@@ -338,6 +338,7 @@ export interface RenderOptions {
   runtimeOptions?: Record<string, any>;
   serverData?: any;
   streamOptions?: RenderToPipeableStreamOptions;
+  documentProps?: Record<string, unknown>;
 }
 
 declare global {

pnpm-lock.yaml

@@ -2157,10 +2157,10 @@ importers:
         version: 1.2.4
     devDependencies:
       '@ice/app':
-        specifier: ^3.6.2
+        specifier: ^3.6.3
         version: link:../ice
       '@ice/runtime':
-        specifier: ^1.5.2
+        specifier: ^1.5.3
         version: link:../runtime
       webpack:
         specifier: ^5.88.0
@@ -2252,6 +2252,31 @@ importers:
         specifier: ^5.88.0
         version: 5.88.2
 
+  packages/plugin-react-query:
+    dependencies:
+      '@tanstack/react-query':
+        specifier: ^5.50.1
+        version: 5.50.1(react@18.2.0)
+      '@tanstack/react-query-devtools':
+        specifier: ^5.50.1
+        version: 5.50.1(@tanstack/react-query@5.50.1)(react@18.2.0)
+    devDependencies:
+      '@ice/app':
+        specifier: ^3.4.9
+        version: link:../ice
+      '@ice/runtime':
+        specifier: ^1.4.8
+        version: link:../runtime
+      '@tanstack/query-devtools':
+        specifier: ^5.50.1
+        version: 5.50.1
+      '@types/react':
+        specifier: ^18.0.0
+        version: 18.0.34
+      '@types/react-dom':
+        specifier: ^18.0.0
+        version: 18.0.11
+
   packages/plugin-request:
     dependencies:
       ahooks:
@@ -8568,6 +8593,33 @@ packages:
     dependencies:
       defer-to-connect: 1.1.3
 
+  /@tanstack/query-core@5.50.1:
+    resolution: {integrity: sha512-lpfhKPrJlyV2DSVcQb/HuozH3Av3kws4ge22agx+lNGpFkS4vLZ7St0l3GLwlAD+bqB+qXGex3JdRKUNtMviEQ==}
+    dev: false
+
+  /@tanstack/query-devtools@5.50.1:
+    resolution: {integrity: sha512-MQ5JK3yRwBP1SRuwoJVPGZP4cMLXCQ0t+6blDbcAVGEoqrEuvbgTdwlN729AKBR0hidOWPFR9n5YpI2Y8bBZOQ==}
+
+  /@tanstack/react-query-devtools@5.50.1(@tanstack/react-query@5.50.1)(react@18.2.0):
+    resolution: {integrity: sha512-zgPmEFv9GhLAx6eaf9r0ACbcxit1ZSuv/uPpOXBTTSPLijlWcfpQTOdZx0jYQ14t2cUfWjrAW41cUmcCvT4X/g==}
+    peerDependencies:
+      '@tanstack/react-query': ^5.50.1
+      react: ^18 || ^19
+    dependencies:
+      '@tanstack/query-devtools': 5.50.1
+      '@tanstack/react-query': 5.50.1(react@18.2.0)
+      react: 18.2.0
+    dev: false
+
+  /@tanstack/react-query@5.50.1(react@18.2.0):
+    resolution: {integrity: sha512-s0DW3rVBDPReDDovUjVqItVa3R2nPfUANK9nqGvarO2DwTiY9U4EBTsqizMxItRCoGgK5apeM7D3mxlHrSKpdQ==}
+    peerDependencies:
+      react: ^18.0.0
+    dependencies:
+      '@tanstack/query-core': 5.50.1
+      react: 18.2.0
+    dev: false
+
   /@testing-library/dom@8.20.0:
     resolution: {integrity: sha512-d9ULIT+a4EXLX3UU8FBjauG9NnsZHkHztXoIcTsOKoOw030fyjheN9svkTULjJxtYag9DZz5Jz5qkWZDPxTFwA==}
     engines: {node: '>=12'}

tests/integration/with-fallback-entry.test.ts

@@ -20,7 +20,7 @@ describe(`build ${example}`, () => {
     sizeFallback = fs.statSync(fallbackPath).size;
 
     expect(sizeFallback).toBeLessThan(sizeServer);
-    // The Stat size of fallback entry will reduce more than 50kb.
+    // The Stat size of fallback entry will reduce more than 50kb, minify size is 20kb.
-    expect(sizeServer - sizeFallback).toBeGreaterThan(50 * 1024);
+    expect(sizeServer - sizeFallback).toBeGreaterThan(20 * 1024);
   });
 });