search

eagermko / react-native-unocss

Using UnoCSS in a React Native project
25 stars 0 forks source link

Installation fails after SDK version 51 #2

Open eachann1024 opened 2 weeks ago

eachann1024 commented 2 weeks ago

Install according to the official document process of expo.

  1. npx create-expo-app
  2. pnpm reset-project
  3. pnpm install
  4. pnpm android

This operation process is normal and without problems. However, after performing the following process... image

pnpm android tip: 

› Using Expo Go
› Press s │ switch to development build

› Press a │ open Android
› Press w │ open web

› Press j │ open debugger
› Press r │ reload app
› Press m │ toggle menu
› Press o │ open project code in your editor

› Press ? │ show all commands

Logs for your project will appear below. Press Ctrl+C to exit.
Failed to construct transformer:  Error: Cannot find module 'metro-react-native-babel-transformer'
Require stack:
- D:\WorkOther\DemoApp\node_modules\.pnpm\unonative@0.0.14_postcss@8.4.39_rollup@3.29.4_vite@4.5.3_@types+node@20.14.10_terser@5.31.1_\node_modules\unonative\dist\transformerEntry.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+metro-config@0.18.8\node_modules\@expo\metro-config\build\transform-worker\metro-transform-worker.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+metro-config@0.18.8\node_modules\@expo\metro-config\build\transform-worker\transform-worker.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\metro@0.80.9\node_modules\metro\src\DeltaBundler\getTransformCacheKey.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\metro@0.80.9\node_modules\metro\src\DeltaBundler\Transformer.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\metro@0.80.9\node_modules\metro\src\Bundler.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\metro@0.80.9\node_modules\metro\src\IncrementalBundler.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\metro@0.80.9\node_modules\metro\src\Server.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\metro@0.80.9\node_modules\metro\src\commands\dependencies.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\metro@0.80.9\node_modules\metro\src\index.flow.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\metro@0.80.9\node_modules\metro\src\index.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\node_modules\@expo\cli\build\src\start\server\metro\runServer-fork.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\node_modules\@expo\cli\build\src\start\server\metro\instantiateMetro.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\node_modules\@expo\cli\build\src\start\server\metro\MetroBundlerDevServer.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\node_modules\@expo\cli\build\src\start\server\DevServerManager.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\node_modules\@expo\cli\build\src\start\startAsync.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\node_modules\@expo\cli\build\src\start\index.js
- D:\WorkOther\DemoApp\node_modules\.pnpm\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\node_modules\@expo\cli\build\bin\cli
- D:\WorkOther\DemoApp\node_modules\.pnpm\expo@51.0.18_@babel+core@7.24.7_@babel+preset-env@7.24.7_@babel+core@7.24.7_\node_modules\expo\bin\cli
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:1140:15)
    at Function.Module._load (node:internal/modules/cjs/loader:981:27)
    at Module.require (node:internal/modules/cjs/loader:1231:19)
    at require (node:internal/modules/helpers:177:18)
    at Object.<anonymous> (D:\WorkOther\DemoApp\node_modules\.pnpm\unonative@0.0.14_postcss@8.4.39_rollup@3.29.4_vite@4.5.3_@types+node@20.14.10_terser@5.31.1_\node_modules\unonative\dist\transformerEntry.js:26:59)
    at Module._compile (node:internal/modules/cjs/loader:1364:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1422:10)
    at Module.load (node:internal/modules/cjs/loader:1203:32)
    at Function.Module._load (node:internal/modules/cjs/loader:1019:12)
    at Module.require (node:internal/modules/cjs/loader:1231:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\unonative@0.0.14_postcss@8.4.39_rollup@3.29.4_vite@4.5.3_@types+node@20.14.10_terser@5.31.1_\\node_modules\\unonative\\dist\\transformerEntry.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+metro-config@0.18.8\\node_modules\\@expo\\metro-config\\build\\transform-worker\\metro-transform-worker.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+metro-config@0.18.8\\node_modules\\@expo\\metro-config\\build\\transform-worker\\transform-worker.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\metro@0.80.9\\node_modules\\metro\\src\\DeltaBundler\\getTransformCacheKey.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\metro@0.80.9\\node_modules\\metro\\src\\DeltaBundler\\Transformer.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\metro@0.80.9\\node_modules\\metro\\src\\Bundler.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\metro@0.80.9\\node_modules\\metro\\src\\IncrementalBundler.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\metro@0.80.9\\node_modules\\metro\\src\\Server.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\metro@0.80.9\\node_modules\\metro\\src\\commands\\dependencies.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\metro@0.80.9\\node_modules\\metro\\src\\index.flow.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\metro@0.80.9\\node_modules\\metro\\src\\index.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\\node_modules\\@expo\\cli\\build\\src\\start\\server\\metro\\runServer-fork.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\\node_modules\\@expo\\cli\\build\\src\\start\\server\\metro\\instantiateMetro.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\\node_modules\\@expo\\cli\\build\\src\\start\\server\\metro\\MetroBundlerDevServer.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\\node_modules\\@expo\\cli\\build\\src\\start\\server\\DevServerManager.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\\node_modules\\@expo\\cli\\build\\src\\start\\startAsync.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\\node_modules\\@expo\\cli\\build\\src\\start\\index.js',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\@expo+cli@0.18.22_expo-modules-autolinking@1.11.1\\node_modules\\@expo\\cli\\build\\bin\\cli',
    'D:\\WorkOther\\DemoApp\\node_modules\\.pnpm\\expo@51.0.18_@babel+core@7.24.7_@babel+preset-env@7.24.7_@babel+core@7.24.7_\\node_modules\\expo\\bin\\cli'
  ]
}

Then I installed pnpm install metro-react-native-babel-transformer.

After that, there are no more errors when running, but the Android virtual machine shows this:

error

eachann1024 commented 2 weeks ago

install metro-react-native-babel-transformer After installing this component, problems occurred. I suspect it is this problem, but your example did not let me install this control. However, if I do not install it, an error will occur.

eachann1024 commented 2 weeks ago

image

After deleting this file, the actual test shows that it is normal, and of course, it will not take effect.