react native android app to react native web app

user_8709100 0
Viewed 401

I am trying to convert my react-native android app into a react-native web app. While doing this I got an error in @react-native-picker\picker.

Failed to compile ./node_modules/@react-native-picker/picker/js/Picker.web.js SyntaxError: C:\Users\User\Desktop\react-native\TestProject\node_modules@react-native-picker\picker\js\Picker.web.js: Unexpected token (9:12)

   7 | 
   8 | import React from 'react';
>  9 | import type {
     |             ^
  10 |   ViewStyleProp,
  11 |   TextStyleProp,
  12 | } from 'react-native/Libraries/StyleSheet/StyleSheet';

how can i resolve this issue?

react-native-web react-native reactjs picker web
1 Answers

It looks like Picker.web.js contains code written with Flow so you'll need to make sure your web project has support for Flow enabled.

Since you are using Create React App, you'll need to customize the configuration to enable Babel for packages inside of node_modules:

  1. Install customize-cra and react-app-rewired:
npm install --save-dev customize-cra react-app-rewired

  1. Follow the steps to complete the installation of react-app-rewired: https://github.com/timarney/react-app-rewired#how-to-rewire-your-create-react-app-project

  2. Configure Babel include for node_modules/@react-native-picker/picker:

// config-overrides.js

const path = require('path');
const {
    babelInclude,
    override,
} = require('customize-cra');

module.exports = override(
    babelInclude([
        path.resolve('src'),
        path.resolve(__dirname, 'node_modules/@react-native-picker/picker'),
    ]),
);
user_20896250
Related