ant-design-mobile-rn: Can't resolve '../../Utilities/Platform' in 'path/to/project/node_modules/react-native/Libraries/Components/TextInput'

I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

https://github.com/f4z3k4s/ant-design-rn-minimal-repro

Steps to reproduce

Try to run project on web with npm run web which runs expo start --web. Compliation fails with this error:

path/to/project/node_modules/react-native/Libraries/Components/TextInput/TextInputState.js
Module not found: Can't resolve 'path/to/project/node_modules/react-native/Libraries/Components/TextInput'

What is expected?

It is expected that package supports expo’s web platform.

What is actually happening?

Error occurs when trying to use package on web.

Environment	Info
antd	4.0.0
React	16.9.0/0.61.5
System	MacOS Catalina (10.15.5)
Browser	Version 83.0.4103.106 (Official Build) (64-bit)

Edit: I do think it could very well be an issue with @react-native-community/viewpager that you use as peer-dependency based on this issue.

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 2
Comments: 19 (1 by maintainers)

Most upvoted comments

use dedicated emulator for your project instead of web shit😂😂😂

+16

Nishant-Karki on Mar 9, 2021

Solution I found is to use antd-mobile as alias for react-native-web

const createExpoWebpackConfigAsync = require('@expo/webpack-config')
const paths = require("@expo/config/paths");

module.exports = async function(env, argv) {
  const config = await createExpoWebpackConfigAsync(env, argv)

  config.resolve.alias = {
    ...config.resolve.alias,
    '@ant-design/react-native': 'antd-mobile',
  }

  // Maybe you want to turn off compression in dev mode.
  if (config.mode === "development") {
    config.devServer.compress = false;
  }

  // Or prevent minimizing the bundle when you build.
  if (config.mode === "production") {
    config.optimization.minimize = false;
  }

  // FIXME: ../../Utilities/Platform not found for react-native-web
  config.module.rules = [
		...config.module.rules,
  ];

	return config
}

90dy on Jul 22, 2020

@gponsinet wen i install antd-mobile, is works, thanks

ZeroJian on Nov 20, 2020

config.module.rules = [ …config.module.rules, ];

Hi,

Can you please comment on the config.module.rules part and the Utilities/Platform issue? How do I tell my componntes from react-native in node_modules that they need to point to ./react-native-web/src/exports/Platform instead of ../../Utilities/Platform?

Thx

alfogo on Mar 2, 2022