Tailwind 不应用某些字体大小类

Posted 2023-03-07

【中文标题】Tailwind 不应用某些字体大小类

【英文标题】：Tailwind doesn't apply some font size classes

【发布时间】：2021-06-21 20:28:25

【问题描述】：

所以我开始在我的 React 项目中使用 Tailwind 2.0，而且大多数事情似乎都运行良好。颜色、尺寸、弹性框、网格等。到目前为止，这些实用程序都没有问题。但由于某种原因，某些字体大小类将无法正常工作。例如，如果我使用text-lg，则应用样式 as you can see here.

但如果我尝试比这更大的东西，比如text-2x1 或更高，the class isn't applied.

我搜索了很多，但没有找到任何可以帮助我的东西。

我不知道这是否有帮助，但这是我的配置文件（即使在我对其进行任何更改之前它就已经发生了）：

module.exports = 
  purge: ["./src/**/*.js,jsx,ts,tsx", "./public/index.html"],
  darkMode: false, // or 'media' or 'class'
  theme: 
    extend: 
      colors: 
        normal: "#A8A878",
        poison: "#A040A0",
        psychic: "#F85888",
        grass: "#78C850",
        ground: "#E0C068",
        ice: "#98D8D8",
        fire: "#F08030",
        rock: "#B8A038",
        dragon: "#7038F8",
        water: "#6890F0",
        bug: "#A8B820",
        dark: "#705848",
        fighting: "#C03028",
        ghost: "#705898",
        steel: "#B8B8D0",
        flying: "#A890F0",
        electric: "#F8D030",
        fairy: "#EE99AC",
        noType: "lightgray",
      ,
    ,
  ,
  variants: 
    extend: ,
  ,
  plugins: [],
;

index.css 只是 Tailwind 工作的最低要求：

@tailwind base;
@tailwind components;
@tailwind utilities;

这里是存储库：https://github.com/TheSirion/pokedex

【参考方案1】：

看起来您使用了错误的 className，text-2x1 className 错误，您应该使用 text-2xl。

供您参考，请查看官方Doc 以查看更多字体大小的类名。

【讨论】：

谢谢！我不敢相信我花了这么长时间试图弄明白，只是因为我把小写的 L 弄混了 1。哇！