-
+
-
{ />
+
社区有非常多小伙伴在和我们一同建设 Umi，如果你有兴趣，欢迎 加入我们 。
@@ -24,6 +37,6 @@ export default () => {+ 内置路由、构建、部署、测试、Lint 等，仅需一个 Umi 依赖即可上手开发。 +
++ 蚂蚁集团 10000+ + 应用的选择。同时也在阿里、字节、腾讯、网易、美团、快手等公司有大量应用。 +
++ 内置微前端、数据流、权限、国际化、icons 方案、埋点、antd、请求、CSS + 方案、图表等最佳实践。 +
++ Umi 实现了 web 应用开发的完整生命周期，并使之插件化，包括 Umi + 内部功能也是全由插件实现。 +
++ 基于 React Router 6，类 + Remix，支持嵌套、动态、动态可选、预加载、基于路由的请求优化等。 +
++ MFSU 解 Webpack 编译慢的问题，通过 esbuild + 解压缩、配置、测试的性能问题，还有运行时... +
++ 提供 Vite 和 Webpack + 两种构建模式供开发者选择，并尽可能保证他们之间功能的一致性。 +
++ Umi + 针对依赖做了预打包处理，彻底地锁定依赖，定期更新，让框架的每个版本在 + 10 年后依旧可用。 +
+- 内置路由、构建、部署、测试、Lint 等，仅需一个 Umi 依赖即可上手开发。 -
-- 蚂蚁集团 10000+ 应用的选择。同时也在阿里、字节、腾讯、网易、美团、快手等公司有大量应用。 -
-- 内置微前端、数据流、权限、国际化、icons 方案、埋点、antd、请求、CSS 方案、图表等最佳实践。 -
-- Umi 实现了 web 应用开发的完整生命周期，并使之插件化，包括 Umi 内部功能也是全由插件实现。 -
-- 基于 React Router 6，类 Remix，支持嵌套、动态、动态可选、预加载、基于路由的请求优化等。 -
-- MFSU 解 Webpack 编译慢的问题，通过 esbuild 解压缩、配置、测试的性能问题，还有运行时... -
-- 提供 Vite 和 Webpack 两种构建模式供开发者选择，并尽可能保证他们之间功能的一致性。 -
-- Umi 针对依赖做了预打包处理，彻底地锁定依赖，定期更新，让框架的每个版本在 10 年后依旧可用。 -
-Loading...
} - {posts &&{post.title}
-{post.title}
+@@ -32,4 +39,4 @@ Umi 4 中同时支持 webpack 和 vite 两种构建方式，跑通了后，迫 图：libs example 速度对比图
-可以看到，在这几个场景下，MFSU with esbuild 数据领先。四个模式的页面打开速度差不多，所以对比数据没在图中列出，这也是让我意外的点，原以为 Vite 请求多会让页面打开速度变慢，也有可能项目还不够复杂？ +可以看到，**在这几个场景下，MFSU with esbuild 数据领先。** 四个模式的页面打开速度差不多，所以对比数据没在图中列出，这也是让我意外的点，原以为 Vite 请求多会让页面打开速度变慢，也有可能项目还不够复杂？ diff --git a/docs/blog/mfsu-independent-usage.md b/docs/docs/blog/mfsu-independent-usage.md similarity index 69% rename from docs/blog/mfsu-independent-usage.md rename to docs/docs/blog/mfsu-independent-usage.md index ff9902a91750..68857e23e3c4 100644 --- a/docs/blog/mfsu-independent-usage.md +++ b/docs/docs/blog/mfsu-independent-usage.md @@ -1,4 +1,9 @@ -import { Message } from 'umi'; +--- +toc: content +order: 4 +group: + title: Blog +--- # 独立使用 MFSU @@ -31,8 +36,8 @@ CRA v5 配置示例： +:::info 使用这种方案的好处是：在开发环境获得比 `babel` 更快的编译和启动速度 - +::: ```js // webpack.config.js -const { esbuildLoader } = require('@umijs/mfsu') -const esbuild = require('esbuild') +const { esbuildLoader } = require('@umijs/mfsu'); +const esbuild = require('esbuild'); module.exports = { module: { @@ -140,22 +143,21 @@ module.exports = { options: { handler: [ // [mfsu] 3. add mfsu esbuild loader handlers - ...mfsu.getEsbuildLoaderHandler() + ...mfsu.getEsbuildLoaderHandler(), ], target: 'esnext', - implementation: esbuild - } - } - } - ] - } -} + implementation: esbuild, + }, + }, + }, + ], + }, +}; ``` -})
+
解法：配置 `SOCKET_SERVER=127.0.0.1:${port}` 启动项目
@@ -47,7 +51,7 @@ export default {
## Error evaluating function `round`: argument must be a number
-})
+
解法：新版 less 中 `/` 默认被识别为属性简写，通过配置 `lessLoader: { math: 'always' }` 恢复旧版行为（默认将 `/` 用作计算符号）。
diff --git a/docs/docs/introduce/img/less-error.png b/docs/docs/docs/introduce/img/less-error.png
similarity index 100%
rename from docs/docs/introduce/img/less-error.png
rename to docs/docs/docs/introduce/img/less-error.png
diff --git a/docs/docs/introduce/img/rstart.png b/docs/docs/docs/introduce/img/rstart.png
similarity index 100%
rename from docs/docs/introduce/img/rstart.png
rename to docs/docs/docs/introduce/img/rstart.png
diff --git a/docs/docs/introduce/introduce.md b/docs/docs/docs/introduce/introduce.md
similarity index 99%
rename from docs/docs/introduce/introduce.md
rename to docs/docs/docs/introduce/introduce.md
index 5016f275c31f..800eef9f3fce 100644
--- a/docs/docs/introduce/introduce.md
+++ b/docs/docs/docs/introduce/introduce.md
@@ -1,3 +1,7 @@
+---
+order: 1
+toc: content
+---
# Umi 介绍