Customizing style not working

[rhkdgns95]

The bug occurs when:

// tailwind.config.js
const px0_10 = { ...Array.from(Array(11)).map((_, i) => `${i}px`) };
const px0_100 = { ...Array.from(Array(101)).map((_, i) => `${i}px`) };
const px0_200 = { ...Array.from(Array(201)).map((_, i) => `${i}px`) };
const px0_400 = { ...Array.from(Array(401)).map((_, i) => `${i}px`) };

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./src/components/**/*.{js,ts,jsx,tsx}",
    "./src/routers/**/*.{js,ts,jsx,tsx}",
    "./src/icons/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      fontFamily: {
        pretendard: ["Pretendard"],
        poppins: ["Poppins"],
      },
      borderWidth: px0_10,
      fontSize: px0_100,
      lineHeight: px0_100,
      minWidth: px0_200,
      minHeight: px0_200,
      spacing: px0_200,
      padding: px0_400,
    },
  },
  plugins: [],
};

// When text is repeatedly entered, only the last text-[white] value is applied.
// text-28 does not apply! (When checking in developer tools, it is not indicated in the class value)
const Text = tw.p`text-28 text-[white]`;

// When writing like this, only text-28 value is applied.
// text-[white] does not apply! (Likewise, the class is not marked)
const OtherText = tw.p`text-[white] text-28`;

// When writing like this, Both text-[white] and text-[28px] are applied.
const OtherText = tw.p`text-[white] text-[28px]`;

As shown above, when the customizing style is applied together, if the same text phrase (different style) is written, the style does not work.

Is there any way to solve these issues?

• similar issues: https://github.com/MathiasGilson/Tailwind-Styled-Component/issues/82