CODEWITHSUNDEEP
react-nativeexpotailwind-cssnativewind
Kent Wood
Kent Wood

Reputation: 1522

custom plugin in tailwind.config.js under Expo is not working

i am using tailwindcss in an Expo project, and i try to use some custom color in custom plugin function,however,i got an error says Error: tailwindcss plugin function argument object prop "colors.primary" not implemented, js engine: hermes

meanwhile, if i just comment out that line theme("colors.primary"). i then test the addComponents function, it continue tells me another error Error: tailwindcss plugin function argument object prop "[object Object]" not implemented, js engine: hermes

my tailwind.config.js is like this

const plugin = require("tailwindcss/plugin");
module.exports = {
  theme: {
    extend: {
      colors: {
        primary: "#1F9D55",
        secondary: "#B7DDC1",
        tertiary: "#F7FFF9"       
      },
    },
  },
  plugins: [
    plugin(function ({ addComponents, theme }) {
      
      //it should be print out '#1F9D55', which the color value defined above
      console.log(theme("colors.primary")); 
      // it should register a new class called `heading3`
     addComponents({
        ".heading3": {
          fontSize: "1rem",
          lineHeight: "26px",
          "@screen md": {
            fontSize: "24px",
            lineHeight: "32px",
          },
        },
      });
    }),
  ],
};

anyone have some experises about how to use custom plugin in tailwindcss under expo?
PS:i use nativewind to combine tailwindcss with expo.

Upvotes: 0

Views: 336

Answers (1)

Kent Wood
Kent Wood

Reputation: 1522

oh,i see, it looks this error is print out from twrnc which is another library that can use tailwindcss config in runtime. this library only implement one plugin method, that is addUtilities. so i can write the custom plugin like this

 plugins: [
    plugin(function ({ addUtilities  }) {
     addUtilities({
        ".heading3": {
          fontSize: "1rem",
          lineHeight: "26px"          
        },
      });
    }),
  ],

Upvotes: 0

Related Questions