Reactjs 如何扩展材质ui主题类型并修改Typescript中的现有类型？

我知道我们可以扩展

材质ui

主题

类型并添加新属性，如：

例如，添加

appDrawer

如下：

declare module '@material-ui/core/styles/createMuiTheme' {
  interface Theme {
    appDrawer: {
      width: React.CSSProperties['width']
      breakpoint: Breakpoint
    }
  }
  // allow configuration using `createMuiTheme`
  interface ThemeOptions {
    appDrawer?: {
      width?: React.CSSProperties['width']
      breakpoint?: Breakpoint
    }
  }
}

createMuiTheme({
  palette: {
    grey: {
      light: "#f7f7f7",
      main: "#e1e1e1",
      dark: "#c2c2c2"
    }
  })

declare module "@material-ui/core/styles/createMuiTheme" {
  interface Theme {
    custom?: {
      palette?: {
        grey?: PaletteColorOptions;
      };
    };
    newProp?: whateverTypeItIs
  }
  // allow configuration using `createMuiTheme`
  interface ThemeOptions {
    custom?: {
      palette?: {
        grey?: PaletteColorOptions;
      };
    };
    newProp?: whateverTypeItIs
  }
}

但我的问题是如何修改现有属性，例如，我想将

调色板的
灰色属性更改为如下：

declare module '@material-ui/core/styles/createMuiTheme' {
  interface Theme {
    appDrawer: {
      width: React.CSSProperties['width']
      breakpoint: Breakpoint
    }
  }
  // allow configuration using `createMuiTheme`
  interface ThemeOptions {
    appDrawer?: {
      width?: React.CSSProperties['width']
      breakpoint?: Breakpoint
    }
  }
}

createMuiTheme({
  palette: {
    grey: {
      light: "#f7f7f7",
      main: "#e1e1e1",
      dark: "#c2c2c2"
    }
  })

declare module "@material-ui/core/styles/createMuiTheme" {
  interface Theme {
    custom?: {
      palette?: {
        grey?: PaletteColorOptions;
      };
    };
    newProp?: whateverTypeItIs
  }
  // allow configuration using `createMuiTheme`
  interface ThemeOptions {
    custom?: {
      palette?: {
        grey?: PaletteColorOptions;
      };
    };
    newProp?: whateverTypeItIs
  }
}

但是上面的代码会给我这个错误：

Type '{ light: string; main: string; dark: string; }' is not assignable to type 'Partial<Color>'.
  Object literal may only specify known properties, and 'light' does not exist in type 'Partial<Color>'.

类型“{light:string；main:string；dark:string；}”不可分配给类型“Partial”。
Object literal只能指定已知属性，并且类型“Partial”中不存在“light”。

所以我想扩展
灰色
颜色来接受这些值
{light:string；main:string；dark:string；}

任何帮助都将不胜感激
我刚刚使用了一个变通方法，并将我的所有自定义属性放在a侧的
自定义
键中，如下所示：

declare module '@material-ui/core/styles/createMuiTheme' {
  interface Theme {
    appDrawer: {
      width: React.CSSProperties['width']
      breakpoint: Breakpoint
    }
  }
  // allow configuration using `createMuiTheme`
  interface ThemeOptions {
    appDrawer?: {
      width?: React.CSSProperties['width']
      breakpoint?: Breakpoint
    }
  }
}

createMuiTheme({
  palette: {
    grey: {
      light: "#f7f7f7",
      main: "#e1e1e1",
      dark: "#c2c2c2"
    }
  })

declare module "@material-ui/core/styles/createMuiTheme" {
  interface Theme {
    custom?: {
      palette?: {
        grey?: PaletteColorOptions;
      };
    };
    newProp?: whateverTypeItIs
  }
  // allow configuration using `createMuiTheme`
  interface ThemeOptions {
    custom?: {
      palette?: {
        grey?: PaletteColorOptions;
      };
    };
    newProp?: whateverTypeItIs
  }
}