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

Question

我遇到了React Native顺风类(NativeWind(的问题，因为它只在App.js组件中工作。

我已经为中的文件设置了顺风配置方向以使用tw类，但没有结果：

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

我很确定这个目录是正确的，在一些目录中它是有效的，而在有些目录中它不起作用，任何人都面临着这个问题，对此有什么解决方案？

Answer 1

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

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: [],
};

2. 使用目录的实际名称，例如屏幕。转到React导航在您的React Native项目中安装所需的软件包：

3. npm install@react导航/本地

4. npx-expo安装react本地屏幕react本地安全区域上下文

包装应用程序代码的其余部分。下面是一个例子

import * as React from "react";
import {
NavigationContainer
} from "@react-navigation/native";
export default function App() {
return ( <
NavigationContainer > { /* Wrap Rest of your app code */ } <
/NavigationContainer>
);
}

希望它能正常工作。