feat: support intl in server

alibaba · Apr 26, 2024 · b7dc50f · b7dc50f
1 parent 585af12
commit b7dc50f
Show file tree

Hide file tree

Showing 8 changed files with 45 additions and 18 deletions.
diff --git a/.changeset/brave-actors-suffer.md b/.changeset/brave-actors-suffer.md
@@ -0,0 +1,5 @@
+---
+'@ice/app': patch
+---
+
+feat: support generator api to inject code in server entry
diff --git a/packages/ice/src/createService.ts b/packages/ice/src/createService.ts
@@ -96,8 +96,13 @@ async function createService({ rootDir, command, commandArgs }: CreateServiceOpt
     addEntryCode: (callback: (originalCode: string) => string) => {
       entryCode = callback(entryCode);
     },
-    addEntryImportAhead: (declarationData: Pick<DeclarationData, 'source'>) => {
-      generator.addDeclaration('entry', declarationData);
+    addEntryImportAhead: (declarationData: Pick<DeclarationData, 'source'>, type = 'client') => {
+      if (type === 'both' || type === 'server') {
+        generator.addDeclaration('entryServer', declarationData);
+      }
+      if (type === 'both' || type === 'client') {
+        generator.addDeclaration('entry', declarationData);
+      }
     },
     modifyRenderData: generator.modifyRenderData,
     addDataLoaderImport: (declarationData: DeclarationData) => {

diff --git a/packages/ice/src/service/runtimeGenerator.ts b/packages/ice/src/service/runtimeGenerator.ts
@@ -141,7 +141,7 @@ export default class Generator {
     this.rerender = false;
     this.renderTemplates = [];
     this.renderDataRegistration = [];
-    this.contentTypes = ['framework', 'frameworkTypes', 'routeConfigTypes', 'dataLoaderImport', 'runtimeOptions', 'entry'];
+    this.contentTypes = ['framework', 'frameworkTypes', 'routeConfigTypes', 'dataLoaderImport', 'runtimeOptions', 'entry', 'entryServer'];
     // empty .ice before render
     fse.emptyDirSync(path.join(rootDir, targetDir));
     // add initial templates

diff --git a/packages/ice/src/types/plugin.ts b/packages/ice/src/types/plugin.ts
@@ -13,7 +13,7 @@ export type { CreateLoggerReturnType } from '../utils/logger.js';
 
 type AddExport = (exportData: DeclarationData) => void;
 type AddEntryCode = (callback: (code: string) => string) => void;
-type AddEntryImportAhead = (exportData: Pick<DeclarationData, 'source'>) => void;
+type AddEntryImportAhead = (exportData: Pick<DeclarationData, 'source'>, type?: string) => void;
 type RemoveExport = (removeSource: string | string[]) => void;
 type EventName = 'add' | 'addDir' | 'change' | 'unlink' | 'unlinkDir';
 type GetExportList = (key: string, target?: string) => DeclarationData[];

diff --git a/packages/ice/templates/core/entry.server.ts.ejs b/packages/ice/templates/core/entry.server.ts.ejs
@@ -1,4 +1,5 @@
 import './env.server';
+<%- entryServer.imports %>
 import * as runtime from '@ice/runtime/server';
 <% if (hydrate) {-%>
 import { commons, statics } from './runtime-modules';

diff --git a/packages/plugin-intl/src/index.ts b/packages/plugin-intl/src/index.ts
@@ -51,13 +51,12 @@ const plugin: Plugin = () => ({
             renderLocaleEntry(files);
           }
         }]);
-
         runtimeSource = './locales';
+
+        generator.addEntryImportAhead({
+          source: runtimeSource,
+        }, 'both');
       }
-      generator.addRuntimeOptions({
-        source: runtimeSource,
-        specifier: 'localeMessages',
-      });
     } else {
       logger.warn('No locale files found, please check the `src/locales` folder.');
     }

diff --git a/packages/plugin-intl/src/runtime.tsx b/packages/plugin-intl/src/runtime.tsx
@@ -4,21 +4,30 @@ import type { IntlShape } from 'react-intl';
 import type { RuntimePlugin } from '@ice/runtime/types';
 import type { LocaleConfig } from './types.js';
 
-interface RuntimeOptons {
-  localeMessages?: Record<string, Record<string, string>>;
-}
-
 const EXPORT_NAME = 'locale';
 const cache = createIntlCache();
-let intl: IntlShape = null;
 
 const getDefaultLocale = () => {
   return (typeof navigator !== 'undefined' && navigator.language) || 'zh-CN';
 };
-const runtime: RuntimePlugin<RuntimeOptons> = async ({
+
+const getLocaleMessages = () => {
+  return (typeof window !== 'undefined'
+    // @ts-ignore
+    ? window.__ICE_LOCALE_MESSAGES__
+    : global.__ICE_LOCALE_MESSAGES__) || {};
+};
+
+const defaultLocale = getDefaultLocale();
+let intl: IntlShape = createIntl({
+  locale: defaultLocale,
+  messages: getLocaleMessages()?.[defaultLocale] || {},
+});
+
+const runtime: RuntimePlugin = async ({
   addProvider,
   appContext,
-}, runtimeOptions) => {
+}) => {
   const { appExport } = appContext;
   const exported = appExport[EXPORT_NAME];
   const localeConfig: LocaleConfig = (typeof exported === 'function' ? await exported() : exported) || {};
@@ -27,7 +36,7 @@ const runtime: RuntimePlugin<RuntimeOptons> = async ({
 
   intl = createIntl({
     ...l,
-    messages: runtimeOptions.localeMessages?.[locale] || {},
+    messages: getLocaleMessages()?.[locale] || {},
     locale: getLocale ? getLocale() : getDefaultLocale(),
   }, cache);
   addProvider(({ children }) => {

diff --git a/packages/plugin-intl/templates/locales.ts.ejs b/packages/plugin-intl/templates/locales.ts.ejs
@@ -1,5 +1,13 @@
 <%- localeImport %>
 
-export default {
+const localeMessages = {
   <%- localeExport %>
 };
+const LOCALE_KEY = '__ICE_LOCALE_MESSAGES__';
+if (typeof window !== 'undefined') {
+  window[LOCALE_KEY] = localeMessages;
+} else {
+  global[LOCALE_KEY]= localeMessages;
+}
+
+export default localeMessages;