最近在開發react專案，在npm start啟動專案的時候，速度很慢，影響工作效率。並提示嘗試新出的 MFSU 方案：

antd pro v5 專案裡已經使用了MFSU案例。antd pro v4是需要我們自己配置的。

順著所給的git地址去看了一下，並結合我的嘗試給大家記錄一下。

什麼是 MFSU？

• 不管多大的專案，有快取時啟動 1s+，熱更新平均 500ms 內
• 配置 mfsu 開啟，無需修改專案程式碼
• 基於 webpack 的通用方案，umi 3 專案均可用
• 可用於生產，可多人協作
• beta 階段提供手把手服務群

重點來了，我們如何使用？

1、確保我們的專案是 umi 3 專案，開啟專案的package.json檔案，檢視下dependencies：

如圖所示，我的專案是umi3的，可以使用。

2、修改依賴的umi 版本為 "^3.5.0"

可以直接改上圖的umi，刪除node_modules,重新裝依賴，npm install 一下。

"umi": "^3.5.0"

也可以直接在終端輸入命令：

npm install umi@3.5 --save
// or
yarn add umi@3.5

3、在config.ts或者是config.js裡修改配置

export default defineConfig({
  mfsu: {},
  webpack5: {},
  ...
});

上面的mfsu加上了，還要加上webpack5,剛開始我沒加webpack5，就出現了下面的報錯。

4、然後 npm start ，專案就成功啟動了。