在另一个组件中使用自定义 MUI 主题

Question

我正在使用 next js 和 Mui 5，我想在另一个文件中使用断点主题。我无法理解如何使用它。 这是我的 breakpoint.js 文件

import {createTheme } from '@mui/material/styles';
declare module '@mui/material/styles' {
    interface BreakpointOverrides {
      xs: false; 
      sm: false;
      md: false;
      lg: false;
      xl: false;
      mobile: true; 
      tablet: true;
      laptop: true,
      desktop: true;
    }  
}

export const breakpointTheme = createTheme({
    breakpoints: {
      values: {
        mobile: 360,
        tablet: 768,
        laptop: 1024,
        desktop: 1440,
      },
    },
});

这是我想在另一个文件的主题中使用 breakpointTheme 的文件。

export const theme = responsiveFontSizes(createTheme({
  palette: {
    warning: {
      light: warningLight,
      main: warning,
      dark: warningDark,
    },
    info: {
      light: infoLight,
      main: info,
      dark: infoDark,
    },
    // here I want to use breakpoint component   
  },
}));

Answer 1

您找到解决方案了吗？ 导入文件独立工作，但不适用于 webpack