necolas / react-native-web

Cross-platform React UI packages
https://necolas.github.io/react-native-web
MIT License
21.67k stars 1.79k forks source link

0.7.2 breaks React-native-vector-icons #967

Closed vladp closed 6 years ago

vladp commented 6 years ago

Getting below error after 0.7.2 upgrade (from 0.6.1) I suspect there was a removal of shim methods through the RNW


./node_modules/react-native-vector-icons/lib/tab-bar-item-ios.js
64:35-44 './react-native' does not contain an export named 'TabBarIOS'.

my app build environment is setup with default, non-ejected CRA, with a rewire overrides to add some directories (including the one, to add RN vector icons directories, into Babel-loader's include directories array). this setup is working with RNW release 0.6.1 I can post details, but I doubt that this is a problem with my setup.

I had also included (even though this was not needed with 6.0.1 and CRA), the npm install --dev babel-plugin-react-native-web (as I noticed that there is a recently released update) -- but that is not helping.

thank you

P.S. I appreciate the difficulty/challenge RNW is facing, in maintaining a API-compatibility surface even for pieces of RN API that are not yet implemented by RNW. May be as enhancement, RNW could offer its users to register 'custom' compatibility shims for RN APIs, globals and components, so that RNW does not have to make new releases just to keep up with React's API surface changes.
This way RNW uses can, themselves 'plug' the API call holes, until they are implemented in RNW (or stay unimplemented).

brunolemos commented 6 years ago

Workaround

Use patch-package to comment the lines that are causing the issue:

diff --git a/node_modules/react-native-vector-icons/lib/create-icon-set.js b/node_modules/react-native-vector-icons/lib/create-icon-set.js
index 019313b..5b93bf2 100644
--- a/node_modules/react-native-vector-icons/lib/create-icon-set.js
+++ b/node_modules/react-native-vector-icons/lib/create-icon-set.js
@@ -9,8 +9,8 @@ import {
 } from './react-native';

 import createIconButtonComponent from './icon-button';
-import createTabBarItemIOSComponent from './tab-bar-item-ios';
-import createToolbarAndroidComponent from './toolbar-android';
+// import createTabBarItemIOSComponent from './tab-bar-item-ios';
+// import createToolbarAndroidComponent from './toolbar-android';

 const NativeIconAPI =
   NativeModules.RNVectorIconsManager || NativeModules.RNVectorIconsModule;
@@ -164,6 +164,7 @@ export default function createIconSet(glyphMap, fontFamily, fontFile) {
   }

   Icon.Button = createIconButtonComponent(Icon);
+  /*
   Icon.TabBarItem = createTabBarItemIOSComponent(
     IconNamePropType,
     getImageSource
@@ -173,6 +174,7 @@ export default function createIconSet(glyphMap, fontFamily, fontFile) {
     IconNamePropType,
     getImageSource
   );
+  */
   Icon.getImageSource = getImageSource;
   Icon.loadFont = loadFont;
   Icon.hasIcon = hasIcon;
ahmedu007 commented 6 years ago

Just upgraded to ^0.7.3 from ^0.6.0 and getting the same error. Any updates on when the next version would be released with the fix? Thanks

axhamre commented 6 years ago

@vladp A bit off-topic, but would you mind sharing your rewired override that enables a CRA to use react-native-vector-icons?

Would be much appreciated 🙂