Merge branch 'release/next' into fix/optimize-route-config

alibaba · Jul 30, 2024 · d775cdb · d775cdb
2 parents 4b46545 + 60e8e5d
commit d775cdb
Show file tree

Hide file tree

Showing 18 changed files with 157 additions and 42 deletions.
diff --git a/.changeset/early-tomatoes-beg.md b/.changeset/early-tomatoes-beg.md
diff --git a/.changeset/unlucky-boats-type.md b/.changeset/unlucky-boats-type.md
diff --git a/packages/plugin-i18n/package.json b/packages/plugin-i18n/package.json
@@ -57,7 +57,7 @@
   },
   "peerDependencies": {
     "@ice/app": "^3.4.10",
-    "@ice/runtime": "^1.4.10"
+    "@ice/runtime": "^1.4.11"
   },
   "publishConfig": {
     "access": "public"

diff --git a/packages/plugin-intl/CHANGELOG.md b/packages/plugin-intl/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @ice/plugin-intl
 
+## 1.1.0
+
+### Minor Changes
+
+- 2626dcdc: feat: support the simple mode of intl solution
+
 ## 1.0.2
 
 fix: compat with the navigator language return with underslash.

diff --git a/packages/plugin-intl/README.md b/packages/plugin-intl/README.md
@@ -71,3 +71,49 @@ function alertMessage() {
   alert(intl.formatMessage({ id: 'app.welcome' }));
 }
 ```
+
+## Simple mode
+
+Simple mode for remove the dependency of `react-intl`:
+
+Define the plugin in `ice.config.mts`:
+
+```ts
+import { defineConfig } from '@ice/app';
+import intl from '@ice/plugin-intl';
+
+export default defineConfig({
+  plugins: [
+    // Add intlSolution to remove the dependency of react-intl
+    intl({ intlSolution: 'simple' }),
+  ],
+});
+```
+
+When you use the `simple` mode, you can only use the `intl.formateMessage` function to get the locale message:
+
+```tsx
+import { ice } from 'ice';
+
+export default function Home() {
+  console.log(intl.formatMessage({ id: 'new' }));
+  return <h1>home</h1>;
+}
+```
+
+Function `intl.formatMessage` is limited, you can only use the syntax below to get the locale message:
+
+Simple Usage:
+
+```tsx
+intl.formatMessage({ id: 'app.welcome', defaultMessage: 'Welcome to my application!' });
+intl.formatMessage('app.welcome');
+```
+
+With Variables:
+
+```tsx
+intl.formatMessage({ id: 'app.welcome' }, { name: 'icejs' });
+```
+
+> Caution: the message Syntax only support the pattern like `{name}`.
diff --git a/packages/plugin-intl/package.json b/packages/plugin-intl/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ice/plugin-intl",
-  "version": "1.0.2",
+  "version": "1.1.0",
   "description": "react intl plugin for ice.js 3.",
   "files": [
     "esm",
@@ -15,6 +15,7 @@
   "exports": {
     ".": "./esm/index.js",
     "./runtime": "./esm/runtime.js",
+    "./runtime-simple": "./esm/runtime-simple.js",
     "./types": "./esm/types.js"
   },
   "sideEffects": false,
@@ -28,7 +29,7 @@
   },
   "devDependencies": {
     "@ice/app": "^3.4.9",
-    "@ice/runtime": "^1.4.8",
+    "@ice/runtime": "^1.4.11",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0"
   },

diff --git a/packages/plugin-intl/runtime-simple.d.ts b/packages/plugin-intl/runtime-simple.d.ts
@@ -0,0 +1 @@
+export * from './esm/runtime-simple';
diff --git a/packages/plugin-intl/src/index.ts b/packages/plugin-intl/src/index.ts
@@ -10,12 +10,14 @@ interface PluginOptions {
   localeMessagesKey?: string;
   defaultLocaleKey?: string;
   useCDN?: boolean;
+  intlSolution?: 'react-intl' | 'simple';
 }
 
 const plugin: Plugin<PluginOptions> = ({
   localeMessagesKey = '__LOCALE_MESSAGES__',
   defaultLocaleKey = '__DEFAULT_LOCALE__',
   useCDN = false,
+  intlSolution = 'react-intl',
 } = {}) => ({
   name: 'plugin-intl',
   setup: ({ generator, context, createLogger, watch }) => {
@@ -83,12 +85,19 @@ const plugin: Plugin<PluginOptions> = ({
     }
 
     // Add intl export from ice.
-    generator.addExport({
-      specifier: ['useIntl', 'intl'],
-      source: '@ice/plugin-intl/runtime',
-    });
+    if (intlSolution === 'simple') {
+      generator.addExport({
+        specifier: ['intl'],
+        source: '@ice/plugin-intl/runtime-simple',
+      });
+    } else {
+      generator.addExport({
+        specifier: ['useIntl', 'intl'],
+        source: '@ice/plugin-intl/runtime',
+      });
+    }
   },
-  runtime: '@ice/plugin-intl/runtime',
+  runtime: intlSolution === 'simple' ? '@ice/plugin-intl/runtime-simple' : '@ice/plugin-intl/runtime',
 });
 
 export default plugin;
diff --git a/packages/plugin-intl/src/intl-until.ts b/packages/plugin-intl/src/intl-until.ts
@@ -0,0 +1,15 @@
+export const EXPORT_NAME = 'locale';
+
+export const getDefaultLocale = () => {
+  // @ts-ignore
+  const defaultLocale = (typeof window !== 'undefined' && window.__ICE_DEFAULT_LOCALE__) ||
+    (typeof navigator !== 'undefined' && navigator.language) ||
+    'zh-CN';
+  return defaultLocale.replace('_', '-');
+};
+
+export const getLocaleMessages = () => {
+  // @ts-ignore
+  const localeMessages = typeof window === 'undefined' ? global.__ICE_LOCALE_MESSAGES__ : window.__ICE_LOCALE_MESSAGES__;
+  return localeMessages || {};
+};
diff --git a/packages/plugin-intl/src/runtime-simple.ts b/packages/plugin-intl/src/runtime-simple.ts
@@ -0,0 +1,46 @@
+import type { RuntimePlugin } from '@ice/runtime/types';
+import { getDefaultLocale, getLocaleMessages, EXPORT_NAME } from './intl-until.js';
+
+let currentLocale = getDefaultLocale();
+let localeMessages = getLocaleMessages();
+
+const runtime: RuntimePlugin = async ({
+  appContext,
+}) => {
+  const { appExport } = appContext;
+  const { getLocale, ...l } = appExport?.[EXPORT_NAME] || {};
+  if (Object.keys(l)?.length > 0) {
+    console.error('The locale config is not supported in the simple mode.');
+  }
+  const locale = getLocale ? getLocale() : getDefaultLocale();
+  currentLocale = locale;
+  // Refresh locale messages for server side because of import hoisting.
+  localeMessages = getLocaleMessages();
+};
+
+interface MessageDescriptor {
+  id: string;
+  defaultMessage?: string;
+}
+
+const intl = {
+  formatMessage: (message: MessageDescriptor | string, values?: Record<string, string>) => {
+    let messageId = typeof message === 'string' ? message : message.id;
+    const defaultMessage = typeof message === 'string' ? message : message.defaultMessage;
+    let content = localeMessages?.[currentLocale]?.[messageId];
+    if (!content) {
+      console.error(`Message with id "${messageId}" not found in locale "${currentLocale}"`);
+      return defaultMessage || messageId;
+    }
+    if (values) {
+      Object.keys(values).forEach((key) => {
+        content = content.replace(new RegExp(`{${key}}`, 'g'), values[key]);
+      });
+    }
+    return content;
+  },
+};
+
+export { intl };
+
+export default runtime;
diff --git a/packages/plugin-intl/src/runtime.tsx b/packages/plugin-intl/src/runtime.tsx
@@ -2,25 +2,11 @@ import * as React from 'react';
 import { createIntl, createIntlCache, RawIntlProvider, useIntl } from 'react-intl';
 import type { IntlShape } from 'react-intl';
 import type { RuntimePlugin } from '@ice/runtime/types';
+import { getDefaultLocale, getLocaleMessages, EXPORT_NAME } from './intl-until.js';
 import type { LocaleConfig } from './types.js';
 
-const EXPORT_NAME = 'locale';
 const cache = createIntlCache();
 
-const getDefaultLocale = () => {
-  // @ts-ignore
-  const defaultLocale = (typeof window !== 'undefined' && window.__ICE_DEFAULT_LOCALE__) ||
-    (typeof navigator !== 'undefined' && navigator.language) ||
-    'zh-CN';
-  return defaultLocale.replace('_', '-');
-};
-
-const getLocaleMessages = () => {
-  // @ts-ignore
-  const localeMessages = typeof window === 'undefined' ? global.__ICE_LOCALE_MESSAGES__ : window.__ICE_LOCALE_MESSAGES__;
-  return localeMessages || {};
-};
-
 const defaultLocale = getDefaultLocale();
 let intl: IntlShape = createIntl({
   locale: defaultLocale,

diff --git a/packages/plugin-jsx-plus/CHANGELOG.md b/packages/plugin-jsx-plus/CHANGELOG.md
@@ -1,5 +1,11 @@
 # Changelog
 
+## 1.0.4
+
+### Patch Changes
+
+- aaea501d: fix: allow decorators-legacy syntax in js file
+
 ## 1.0.3
 
 ### Patch Changes

diff --git a/packages/plugin-jsx-plus/package.json b/packages/plugin-jsx-plus/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ice/plugin-jsx-plus",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "JSX Plus support for ice.js",
   "license": "MIT",
   "type": "module",

diff --git a/packages/plugin-request/src/hooks.ts b/packages/plugin-request/src/hooks.ts
@@ -4,7 +4,8 @@ import type { AxiosRequestConfig } from 'axios';
 import { request } from './request.js';
 
 interface RequestResult<R, P extends any[]> extends Result<R, P> {
-  request: (...args: P) => Promise<R>;
+  request: Result<R, P>['run'];
+  requestAsync: Result<R, P>['runAsync'];
 }
 
 export function useRequest<TData, TParams extends any[] = []>(
@@ -35,6 +36,8 @@ export function useRequest<TData, TParams extends any[] = []>(
     ...req,
     // Modify ahooks' useRequest `run` as `request`
     request: req.run,
+    // Modify ahooks' useRequest `runAsync` as `requestAsync`
+    requestAsync: req.runAsync,
   } as RequestResult<TData, TParams>;
 }
 

diff --git a/packages/runtime/CHANGELOG.md b/packages/runtime/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @ice/runtime
 
+## 1.4.11
+
+### Patch Changes
+
+- 7992d405: fix: throw error for better debugging
+
 ## 1.4.10
 
 ### Patch Changes

diff --git a/packages/runtime/package.json b/packages/runtime/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ice/runtime",
-  "version": "1.4.10",
+  "version": "1.4.11",
   "description": "Runtime module for ice.js",
   "type": "module",
   "types": "./esm/index.d.ts",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/website/docs/guide/about.md b/website/docs/guide/about.md
@@ -17,15 +17,15 @@ order: 1
 
 在应用框架之上，我们还提供了 NPM 包开发工具 [ICE PKG](https://pkg.ice.work)：
 
-- 提供 React 组件开发、Node.js 模块开发、前端通用库等[多场景需求](https://pkg.ice.work/scenarios/react)
+- 提供 React 组件开发、Node.js 模块开发、前端通用库等[多场景需求](https://pkg.ice.work/guide/scenarios/)
 - 组件开发提供基础研发范式，提供组件文档、示例、预览等功能，[查看文档](https://pkg.ice.work/guide/preview)
 - 更多场景可以通过插件的方式完成定制，查看[插件开发](https://pkg.ice.work/reference/plugins-development)
 
 你也可以搭配 VS Code 插件 AppWorks 享受到更多功能：
 
-- 通过大量的官方模板（fusion/antd）可视化创建项目，[查看更多](https://appworks.site/materialCenter/react.html)
-- 基于 VS Code 插件可视化的调试、管理依赖、拼装区块等，[查看文档](https://appworks.site)
-- 业务可以根据规范定制自己的物料体系（含项目模板），[查看物料开发文档](https://appworks.site/materials/about.html)
+- 通过大量的官方模板（fusion/antd）可视化创建项目，[查看更多](https://github.com/apptools-lab/AppWorks/blob/master/extensions/application-manager/README.zh-CN.md)
+- 基于 VS Code 插件可视化的调试、管理依赖、拼装区块等，[查看文档](https://github.com/apptools-lab/AppWorks/blob/master/extensions/appworks/README.zh-CN.md)
+- 业务可以根据规范定制自己的物料体系（含项目模板），[查看物料开发文档](https://github.com/apptools-lab/AppWorks/blob/master/extensions/material-helper/README.zh-CN.md)
 - ……
 
 ## 常见问题 📝
@@ -47,7 +47,7 @@ ice.js 3 相比之前的版本，增加了更多对移动端能力的优化和
 
 ### 使用飞冰 (ICE) 是否需要具备一定的前端基础？
 
-毫无疑问是需要的，同时我们也在努力降低前端开发的门槛，但一些基础的前端知识还是需要具备的，比如 JavaScript 的基础语法、前后端如何通信等。为了便于快速入门前端知识，我们整理了一份 [前端基础知识](https://ice.work/docs/resource/front-basic)，希望能帮助到开发者。
+毫无疑问是需要的，同时我们也在努力降低前端开发的门槛，但一些基础的前端知识还是需要具备的，比如 JavaScript 的基础语法、前后端如何通信等。为了便于快速入门前端知识，我们整理了一份 [前端基础知识](https://v2.ice.work/docs/resource/front-basic/)，希望能帮助到开发者。
 
 ### 资深前端同学是否适合使用飞冰？