依賴匹配
這一頁說明元件依賴與本地版本不一致時，平台如何決定「能不能渲染」。
為什麼需要匹配
元件在平台上預覽時，使用的是你本地專案裡已安裝的依賴。實際情況經常是：
- 元件要求
echarts@5.2.3 - 你本地安裝的是
echarts@5.0.0
如果要求版本完全一致，大量元件會直接無法使用。平台因此提供五檔匹配規則，由你決定放寬到什麼程度。
五種規則
在「設定 → 預覽規則 → 依賴」中，可以為 dependencies 與 devDependencies 裡的每個套件單獨設定：
| 規則 | 判定方式 | 適用場景 | 標識色 |
|---|---|---|---|
| 自動 | 不做版本限制，使用本地已安裝版本 | 預設值，優先保證能渲染 | 灰 |
| 僅安裝 | 只要本地裝了該套件，不看版本 | 快速預覽，非生產驗證 | 綠 |
| 主版本 | 主版本號相同 | 平衡相容性與穩定性 | 藍 |
| 主次版本 | 主版本與次版本都相同 | 對版本較敏感 | 橘 |
| 完全一致 | 版本號完全相同 | 嚴格版本控制 | 紅 |
規則越往下越嚴格。設定頁每一項前面有對應顏色的圓點，便於快速識別。
版本對照範例
假設元件依賴 echarts@5.2.3：
| 本地版本 | 自動 | 僅安裝 | 主版本 | 主次版本 | 完全一致 |
|---|---|---|---|---|---|
| 5.0.0 | 使用 | 使用 | 使用 | 跳過 | 跳過 |
| 5.2.0 | 使用 | 使用 | 使用 | 跳過 | 跳過 |
| 5.2.3 | 使用 | 使用 | 使用 | 使用 | 使用 |
| 6.0.0 | 使用 | 使用 | 跳過 | 跳過 | 跳過 |
| 未安裝 | 跳過 | 跳過 | 跳過 | 跳過 | 跳過 |
預設行為
- 沒有單獨設定的依賴，預設使用自動。
- 本地完全沒安裝的依賴，任何規則都不會匹配，必須先安裝。
- 框架由元件原始碼決定：引入
vue按 Vue 渲染，引入react按 React 渲染；兩者都引入則無法渲染。
四步排查
1. 切到「全部」
確認元件是否存在，而不是被列表過濾掉了。
2. 看依賴狀態
詳情頁裡：
- 綠色：匹配成功
- 黃色：版本有差異，可以嘗試執行
- 紅色：不匹配或缺失
3. 安裝缺失依賴
bash
npm install <package-name>安裝後重新整理頁面重新偵測。
4. 放寬規則
版本差異不影響功能時，把規則從「完全一致」放寬到「主版本」或「自動」。
規則的作用範圍
依賴匹配只影響線上預覽。下載到專案後的執行使用你專案的依賴，與這裡的規則無關。