尝试将tailwind.config.js编辑为：

module.exports = {
  content: [
    './index.html',
    './src/**/*.{js,ts,jsx,tsx}',
    './pages/**/*.{js,ts,jsx,tsx}',
    './components/**/*.{js,ts,jsx,tsx}',
    './app/**/*.{js,ts,jsx,tsx}',
  ],
  theme: {
    extend: {
      ...
      screens: {
        '2xl': '1536px',
        xl: '1280px',
        lg: '1024px',
        md: '768px',
        sm: '640px',
        xs: '480px',
      },
   },
 },

了解更多here

我相信这是因为你扩展的屏幕与默认的名称相同-所以它可能会弄乱编译的CSS
在您的情况下，编译的CSS将

.text-8xl {
  font-size: 6rem;
  line-height: 1;
}

@media (max-width: 768px) {
  .md\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }
}

@media (max-width: 1024px) {
  .lg\:text-7xl {
    font-size: 4.5rem;
    line-height: 1;
  }
}

lg:text-7xl将覆盖md:text-5xl，因为它们都满足小屏幕上的条件，但最后一个稍后
有两种解决方案

1 -不要展开屏幕

用所需的完全覆盖旧的

const screens = {
  '2xl': { max: '1536px' },
  xl: { max: '1280px' },
  lg: { max: '1024px' },
  md: { max: '768px' },
  sm: { max: '640px' },
  xs: { max: '480px' },
}

module.exports = {
  theme: {
    screens,
  },
  plugins: [],
}

为text-8xl lg:text-7xl md:text-5xl编译的CSS

.text-8xl {
  font-size: 6rem;
  line-height: 1;
}

@media (max-width: 1024px) {
  .lg\:text-7xl {
    font-size: 4.5rem;
    line-height: 1;
  }
}

@media (max-width: 768px) {
  .md\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }
}

好

2 -更改自定义断点的名称

// tailwind.config.js
// Just added `y` prefix to every breakpoint cause I can

const prefixedScreens = {
  'y2xl': { max: '1536px' },
  yxl: { max: '1280px' },
  ylg: { max: '1024px' },
  ymd: { max: '768px' },
  ysm: { max: '640px' },
  yxs: { max: '480px' },
}

module.exports = {
  theme: {
    extend: {
      screens: prefixedScreens,
    },
  },
  plugins: [],
}

现在text-8xl ylg:text-7xl ymd:text-5xl将编译为

.text-8xl {
  font-size: 6rem;
  line-height: 1;
}

@media (max-width: 1024px) {
  .ylg\:text-7xl {
    font-size: 4.5rem;
    line-height: 1;
  }
}

@media (max-width: 768px) {
  .ymd\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }
}

正是我们所需要的
然而我看不出这有什么意义（因为有很多额外的断点你不需要，我会推荐第一个解决方案）