React Native NativeWind(Tailwindcss)无法正常工作

oxcyiej7  于 2023-03-13  发布在  React
关注(0)|答案(1)|浏览(192)

我遇到了一个与React Native tailwind类(NativeWind)有关的问题,因为它只能在App.js组件中工作。
我已经设置了tailwind config direction,让里面的文件使用tw类,但是没有结果:

/taillwind.config.js
content: ["./App.{js,jsx,ts,tsx}", "./<custom directory>/**/*.{js,jsx,ts,tsx}", "./pages/HomeScreen.{js,jsx,ts,tsx}",

目录我很肯定是正确的,在一些目录中它工作在一些不工作,任何人都面临这个问题,以及,什么将是一个解决方案?

gcmastyq

gcmastyq1#

这里你需要tailwind.config.js文件中所有组件文件的路径。记住replace*

module.exports = {
  content: [
    "./App.{js, ts,jsx,tsx}",
    "./screens/**/*.{js,ts,jsx,tsx}",
    "./pages/**/*.{js,ts,jsx,tsx}",
    "components/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
};

1.使用目录的实际名称,例如screens。转到React Navigation在React Native项目中安装所需的包:

  1. npm安装@React导航/本机
  2. npx expo安装React Native屏幕React Native安全区域上下文

Package 应用程序代码的其余部分。以下是一个示例。

import * as React from "react";
import {
  NavigationContainer
} from "@react-navigation/native";

export default function App() {
  return ( <
    NavigationContainer > { /* Wrap Rest of your app code */ } <
    /NavigationContainer>
  );
}

希望它能正常工作。

相关问题