[react native]nativewind...

코드왕·2023년 11월 8일
  1. npm install nativewind

★★중요★★ tailwindcss를 설치해주고, 버전을 3.3.2로 하자

npm install nativewind
npm install --dev tailwindcss@3.3.2
  1. tailwind.config.js를 설정하자

주의사항... 최상단에 style 넣어버리면 안될 수 있따.

npx tailwindcss init
/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./App.{js,jsx,ts,tsx}",
    "./screens/**/*.{js,jsx,ts,tsx}",
    "./components/**/*.{js,jsx,ts,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
};
  1. babel.config.js를 수정하자
module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: ["nativewind/babel"],
  };
};

왜 안되는지 모르겠다... 다만 잘되는 code 공유함..

https://github.com/syednomishah/React-Native-Tailwindcss.git

여기꺼 클론하셈..

profile
CODE DIVE!

0개의 댓글