Logo
    ExpoにTailwind React Native Classnamesを導入

    ExpoにTailwind React Native Classnamesを導入

    はじめに

    ゆとり世代の中野です。

    今回チャレンジした内容は【ExpoにTailwind React Native Classnamesを導入】です。

    さっそくチャレンジについて書いていきます。

    チャレンジする背景

    • ExpoでもTailwindを使いたい

    チャレンジ内容

    • ExpoでもTailwindを動かす

    やり方

    packageを追加

    yarn add twrnc

    まとめ

    • packageを追加するだけです

    さいごに

    具体的な使い方は公式を見てください

    Reference

    twrnc

    A simple, expressive API for TailwindCSS + React Native, written in TypeScript full support for all native RN styles with tailwind counterparts: (view,layout,image,shadow, andtext). compatible with Tailwind CSS v3 and v2 respects your tailwind.config.js for full configuration platform prefixes: android:mt-4 ios:mt-2 dark mode support: bg-white dark:bg-black media query support: w-48 lg:w-64 (also, arbitrary: min-w-[600px]:flex-wrap) device orientation prefixes: portrait:flex-col landscape:flex-row retina device pixel density prefix: w-4 retina:w-2 arbitrary, JIT-style classes: mt-[31px] bg-[#eaeaea] text-red-200/75, etc...

    www.npmjs.com

    twrnc

    yutanakano

    WEBエンジニア

    大阪生まれのゆとり世代です

    趣味はバイクでツーリングに行くこと

    愛車は Ninja ZX-25R SE KRT EDITION

    Expoでプロダクトを作っています

    image

    ©ゆとりちゃれんじ

    GitHubXInstagram