跳到主要內容
+

關於實驗室

此套件包含孵化器元件,這些元件尚未準備好移至核心。

實驗室和核心之間的主要區別在於元件的版本控制方式。擁有獨立的實驗室套件使我們可以在必要時發布重大變更,而核心套件則遵循較慢的政策。

隨著開發人員使用和測試元件並報告問題,維護者會更了解元件的缺點:缺少的功能、可訪問性問題、錯誤、API 設計等等。元件使用時間越長、使用次數越多,就越不可能發現新問題,也因此需要引入重大變更的可能性就越低。

為了讓元件準備好移至核心,將考慮以下標準

  • 它需要被使用。我們在文件中使用 Google Analytics(以及其他指標)來評估每個元件的使用情況。使用率低的實驗室元件要么意味著它尚未完全運作,要么意味著對它的需求不高。
  • 它需要符合核心元件的程式碼品質。它不必完美才能成為核心的一部分,但元件應該足夠可靠,讓開發人員可以依賴它。
    • 每個元件都需要類型定義。目前實驗室元件不一定需要類型化,但要移至核心則需要類型化。
    • 需要良好的測試覆蓋率。目前某些實驗室元件沒有全面的測試。
  • 它可以作為一種槓桿,來激勵使用者升級到最新的主要版本嗎?社群越不分散越好。
  • 它需要在中短期內具有較低的重大變更機率。例如,如果它需要一個可能需要重大變更的新功能,則最好延遲其升級到核心。

安裝

要安裝並儲存到您的 package.json 依賴項中,請執行以下命令之一

npm install @mui/lab @mui/material

請注意,實驗室對 Material UI 元件具有同層級依賴。

TypeScript

為了從主題的 CSS 覆蓋和預設屬性自訂中受益,TypeScript 使用者需要導入以下類型。在內部,它使用模組擴充來擴展預設主題結構,使其包含實驗室中提供的擴充元件。

import type {} from '@mui/lab/themeAugmentation';

const theme = createTheme({
  components: {
    MuiTimeline: {
      styleOverrides: {
        root: {
          backgroundColor: 'red',
        },
      },
    },
  },
});