Cannot start expo after installing NativeWInd v4

[script8888]

Describe the bug
When I run yarn run ios, I get this error in terminal:

tailwindcss(ios) rebuilding... tailwindcss(ios) is taking a long time to build, 
please read https://tailwindcss.com/docs/content-configuration#pattern-recommendations to 
speed up your build time

To Reproduce
Steps to reproduce the behavior:

• Follow all the steps on setting up native wind from the docs https://www.nativewind.dev/v4/getting-started/expo-router

Expected behavior
App preview is supposed to load up.

Screenshots
This is what my expo app shows up.

Files:
my global.css is located at the root dir of the project

// tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./app/**/*.{js,jsx,ts,tsx}", "./components/**/*.{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",
    ],
    plugins: [
      // Required for expo-router
      "expo-router/babel",
      "react-native-reanimated/plugin",
    ]
  };
};

// metro.config.js

// Learn more https://docs.expo.io/guides/customizing-metro
const { getDefaultConfig } = require("expo/metro-config");
const { withNativeWind } = require("nativewind/metro");

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname, { isCSSEnabled: true });

module.exports = withNativeWind(config, { input: "./global.css" });

[Aycom366]

expo already added the reanimated plugin to their babel-preset-expo, so you don't have to set that again provided you're using SDK 50, and of cause, This might not fix it.

[agrittiwari]

TypeError: withNativeWind is not a function
TypeError: withNativeWind is not a function
    at Object.<anonymous> (/Users/agrittiwari/OpenSource/devStory/metro.config.js:10:18)
    at Module._compile (node:internal/modules/cjs/loader:1375:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1434:10)
    at Module.load (node:internal/modules/cjs/loader:1206:32)
    at Function.Module._load (node:internal/modules/cjs/loader:1022:12)
    at Module.require (node:internal/modules/cjs/loader:1234:19)
    at require (node:internal/modules/helpers:176:18)
    at module.exports (/Users/agrittiwari/OpenSource/devStory/node_modules/import-fresh/index.js:28:9)
    at loadJs (/Users/agrittiwari/OpenSource/devStory/node_modules/cosmiconfig/dist/loaders.js:9:18)
    at Explorer.loadFileContent (/Users/agrittiwari/OpenSource/devStory/node_modules/cosmiconfig/dist/createExplorer.js:230:12)

how to add nativewind/metro, if you've added this in package.json @script8888