feat: merge

umijs · Mar 28, 2024 · 024729a · 024729a
2 parents a792b3b + e7e9895
commit 024729a
Show file tree

Hide file tree

Showing 119 changed files with 13,473 additions and 3,130 deletions.
diff --git a/docs/.dumi/components/Footer/NewsLetterForm.tsx b/docs/.dumi/components/Footer/NewsLetterForm.tsx
diff --git a/docs/.dumi/components/Footer/index.less b/docs/.dumi/components/Footer/index.less
@@ -34,62 +34,6 @@
         }
       }
 
-      .right {
-        min-width: 400px;
-        font-size: 16px;
-        .copyright {
-          font-size: 14px;
-          color: #8996a1;
-          line-height: 22px;
-          margin-top: 24px;
-        }
-      }
-    }
-  }
-}
-
-.news_letter {
-  font-size: 18px;
-  margin-bottom: 14px;
-
-  :global {
-    h2 {
-      font-size: 18px;
-      font-weight: 400;
-    }
-    input {
-      background: #ffffff;
-      border: 1px solid #bac1c8;
-      width: 180px;
-      font-size: 14px;
-      height: 28px;
-      line-height: 28px;
-      padding: 0 4px;
-    }
-
-    button {
-      font-size: 14px;
-      color: #ffffff;
-      margin-left: 14px;
-      background-image: linear-gradient(
-        224deg,
-        #0071da 0%,
-        #1890ff 100%,
-        #1890ff 100%
-      );
-      height: 28px;
-      line-height: 28px;
-      padding: 0 10px;
-      border: none;
-    }
-
-    button:hover {
-      background-image: linear-gradient(
-        224deg,
-        #48a4fe 0%,
-        #6fbafe 100%,
-        #8dc9ff 100%
-      );
     }
   }
 }
diff --git a/docs/.dumi/components/Footer/index.tsx b/docs/.dumi/components/Footer/index.tsx
@@ -1,6 +1,5 @@
 import { Link } from 'umi';
 import styles from './index.less';
-import { NewsLetterForm } from './NewsLetterForm';
 
 export const Footer = () => {
   return (
@@ -40,9 +39,6 @@ export const Footer = () => {
             </div>
           </div>
         </div>
-        <div className="right">
-          <NewsLetterForm />
-        </div>
       </div>
     </div>
   );

diff --git a/docs/.dumi/global.less b/docs/.dumi/global.less
@@ -0,0 +1,9 @@
+// hide mf related docs
+.dumi-default-sidebar-group {
+  a[href="/docs/guides/mfsu"],
+  a[href="/en-US/docs/guides/mfsu"],
+  a[href="/docs/max/mf"],
+  a[href="/en-US/docs/max/mf"] {
+    display: none;
+  }
+}
diff --git a/docs/.dumi/pages/index.en-US.tsx b/docs/.dumi/pages/index.en-US.tsx
@@ -0,0 +1 @@
+export { default } from '.';
diff --git a/docs/.dumi/theme/builtins/HashAnchorCompat/index.tsx b/docs/.dumi/theme/builtins/HashAnchorCompat/index.tsx
@@ -0,0 +1,17 @@
+import { useLayoutEffect } from 'react';
+
+interface IHashAnchorCompatProps {
+  from: string;
+  to: string;
+}
+
+export default function HashAnchorCompat({ from, to }: IHashAnchorCompatProps) {
+  useLayoutEffect(() => {
+    const hash = window.location.hash;
+    if (hash === from) {
+      window.location.hash = to;
+    }
+  }, []);
+
+  return null;
+}
diff --git a/docs/.dumirc.ts b/docs/.dumirc.ts
@@ -32,15 +32,18 @@ export default defineConfig({
   define: {
     'process.env.UMI_VERSION': version,
   },
+  locales: [
+    { id: 'zh-CN', name: '中文' },
+    { id: 'en-US', name: 'EN' },
+  ],
   themeConfig: {
     name: 'UmiJS',
     socialLinks: {
       github: 'https://github.com/umijs/umi',
     },
     footer: 'Open-source MIT Licensed | Copyright © 2017-present',
     nav: {
-      mode: 'override',
-      value: [
+      'zh-CN': [
         {
           title: '介绍',
           link: '/docs/introduce/introduce',
@@ -67,155 +70,31 @@ export default defineConfig({
           activePath: '/blog',
         },
       ],
-    },
-    sidebar: {
-      '/docs/guides': [
+      'en-US': [
         {
-          children: [
-            {
-              title: '快速上手',
-              link: '/docs/guides/getting-started',
-            },
-            {
-              title: '开发环境',
-              link: '/docs/guides/prepare',
-            },
-            {
-              title: '目录结构',
-              link: '/docs/guides/directory-structure',
-            },
-            {
-              title: '路由',
-              link: '/docs/guides/routes',
-            },
-            {
-              title: '插件',
-              link: '/docs/guides/use-plugins',
-            },
-            {
-              title: 'Mock',
-              link: '/docs/guides/mock',
-            },
-            {
-              title: '代理',
-              link: '/docs/guides/proxy',
-            },
-            {
-              title: '样式',
-              link: '/docs/guides/styling',
-            },
-            {
-              title: '路由数据加载',
-              link: '/docs/guides/client-loader',
-            },
-            {
-              title: 'TypeScript',
-              link: '/docs/guides/typescript',
-            },
-            {
-              title: '环境变量',
-              link: '/docs/guides/env-variables',
-            },
-            {
-              title: '脚手架',
-              link: '/docs/guides/boilerplate',
-            },
-            {
-              title: '微生成器',
-              link: '/docs/guides/generator',
-            },
-            {
-              title: '编码规范',
-              link: '/docs/guides/lint',
-            },
-            {
-              title: '调试',
-              link: '/docs/guides/debug',
-            },
-            {
-              title: '测试',
-              link: '/docs/guides/test',
-            },
-            {
-              title: '开发插件',
-              link: '/docs/guides/plugins',
-            },
-            {
-              title: '使用 Vue',
-              link: '/docs/guides/use-vue',
-            },
-            {
-              title: 'MPA 模式',
-              link: '/docs/guides/mpa',
-            },
-            // 暂不开放
-            // {
-            //   title: 'MFSU',
-            //   link: 'docs/guides/mfsu',
-            // },
-          ],
+          title: 'Introduce',
+          link: '/en-US/docs/introduce/introduce',
+          activePath: '/en-US/docs/introduce',
+        },
+        {
+          title: 'Guide',
+          link: '/en-US/docs/guides/getting-started',
+          activePath: '/en-US/docs/guides',
+        },
+        {
+          title: 'API',
+          link: '/en-US/docs/api/api',
+          activePath: '/en-US/docs/api',
+        },
+        {
+          title: 'Umi Max',
+          link: '/en-US/docs/max/introduce',
+          activePath: '/en-US/docs/max',
         },
-      ],
-      '/docs/max': [
         {
-          children: [
-            {
-              title: 'Umi Max 简介',
-              link: '/docs/max/introduce',
-            },
-            {
-              title: '布局与菜单',
-              link: '/docs/max/layout-menu',
-            },
-            {
-              title: 'antd',
-              link: '/docs/max/antd',
-            },
-            {
-              title: '图表',
-              link: '/docs/max/charts',
-            },
-            {
-              title: '数据流',
-              link: '/docs/max/data-flow',
-            },
-            {
-              title: '请求',
-              link: '/docs/max/request',
-            },
-            {
-              title: '权限',
-              link: '/docs/max/access',
-            },
-            {
-              title: '国际化',
-              link: '/docs/max/i18n',
-            },
-            {
-              title: '微前端',
-              link: '/docs/max/micro-frontend',
-            },
-            {
-              title: 'styled-components',
-              link: '/docs/max/styled-components',
-            },
-            {
-              title: 'react-query',
-              link: '/docs/max/react-query',
-            },
-            {
-              title: 'valtio',
-              link: '/docs/max/valtio',
-            },
-            {
-              title: 'dva',
-              link: '/docs/max/dva',
-            },
-            {
-              title: '站点统计',
-              link: '/docs/max/analytics',
-            },
-          ],
+          title: 'Blog',
+          link: '/en-US/blog/umi-4-rc',
+          activePath: '/en-US/blog',
         },
       ],
     },

diff --git a/docs/docs/blog/code-splitting.en-US.md b/docs/docs/blog/code-splitting.en-US.md
@@ -0,0 +1,50 @@
+---
+toc: content
+order: 5
+group:
+  title: Blog
+---
+
+# 代码拆分指南
+
+Umi 4 默认 按页拆包、按需加载（这近似等同于 Umi 3 中的 `dynamicImport`），通过 [`loading.tsx`](../docs/guides/directory-structure#loadingtsxjsx) 来自定义加载动画。
+
+### 使用分包策略
+
+Umi 4 内置了不同的代码拆分策略 ( [codeSplitting](../docs/api/config#codesplitting) ) ，通过配置开启：
+
+```ts
+// .umirc.ts
+export default {
+  codeSplitting: {
+    jsStrategy: 'granularChunks',
+  },
+};
+```
+
+这会按照一定的优化策略进行自动分包，若需手动进行更细致的分包，请参见下文。
+
+### 手动拆分
+
+当你的产物体积变大时，可进一步手动拆包：
+
+```ts
+import { lazy, Suspense } from 'react'
+
+// './Page' 该组件将被自动拆出去
+const Page = lazy(() => import('./Page'))
+
+export default function() {
+  return (
+    <Suspense fallback={<div>loading...</div}>
+      <Page />
+    </Suspense>
+  )
+}
+```
+
+通常情况下，我们会手动拆分引用了较大第三方库的组件，实现按需加载。
+
+### 分析产物构成
+
+通过指定 [ANALYZE](../docs/guides/env-variables#analyze) 环境变量可以分析产物构成，根据分析结果来修改代码和进一步决策。