Expo 和 Nativewind v4 问题。未应用样式

问题描述 投票:0回答:1

我尝试了一切。具体遵循文档: tailwind.config.js:

/** @type {import('tailwindcss').Config} */
module.exports = {
  // NOTE: Update this to include the paths to all of your component files.
  content: ["./app/**/*.{js,jsx,ts,tsx}"],
  presets: [require("nativewind/preset")],
  theme: {
    extend: {},
  },
  plugins: [],
}

babel.config.js

module.exports = function (api) {
  api.cache(true);
  return {
    presets: [
      ["babel-preset-expo", { jsxImportSource: "nativewind" }],
      "nativewind/babel",
    ],
  };

_layout.jsx:

import { StyleSheet, Text, View } from 'react-native'
import React from 'react'
import { Slot } from 'expo-router'

export default function _layout() {
  return (
   <>
   <Slot/>
   </>
  )
}

index.jsx:

import {  Text, View } from 'react-native';
import { Link } from 'expo-router';

export default function HomeScreen() {
  return (
   
    <View className='flex-1 justify-center items-center'>
    <Text className='text-white text-lg'>Hello, Tailwind CSS!</Text>
    <Link href="/profile">Profile</Link>
  </View>


  );
}

仍然没有应用样式。P.S我还添加了metro.config.js。尝试使用v2,但它说我需要更新SDK

react-native expo tailwind-css config nativewind
1个回答
0
投票

您是否按照文档中的方式创建了 global.css 文件?

© www.soinside.com 2019 - 2024. All rights reserved.