Have you been in a situation where you installed a package and it doesn't work with the latest version of react-native because the path of RN header file has changed? I ran into a similar problem and here's how I fixed it.
I was working on a react-native project and wanted to detect changes when the silent switch is flipped on or off. As usual, I searched and found a nifty package
(react-native-silent-switch) that did the job. I added that in my project as mentioned in its documentation and hit a snag. It gave an error during compilation due to wrong path in header file
RCTSilentSwitch.h. Normally I would switch to some similar package which doesn't have this problem, but in this case I couldn't find a better alternative. (Maybe I should write one)
I could have modified the file but it has two problems. One, any other developer has to manually do those changes on hiss side, and, secondly, my CI build would fail. The build would fail because the file was part of a node packages this is installed via
I needed a way to modify
RCTSilentSwitch.h AFTER it has been installed by
npm and BEFORE it start compiling. My initial reaction was to use the
post-install stage to patch the file, but I thought, there might be something out there for it too. So, I searched again and found another cool package that did just that. It was aptly named
patch-package allows you to modify the code in
node_modules directory, in the form of patches. The usage was quite simple too.
I followed the following steps to get my build working again:
patch-packageas dev dependencies by following the setup instructions
- I changed the required include path in
RCTSilentSwitch.hand generated a patch file using the following command:
yarn patch-package react-native-silent-switch
A patch file was generated in
patches directory. It's content is as follows
diff --git a/node_modules/react-native-silent-switch/RCTSilentSwitch.h b/node_modules/react-native-silent-switch/RCTSilentSwitch.h index 61c955f..0adef09 100644 --- a/node_modules/react-native-silent-switch/RCTSilentSwitch.h +++ b/node_modules/react-native-silent-switch/RCTSilentSwitch.h @@ -1,4 +1,4 @@ -#import "RCTBridgeModule.h" +#import "React/RCTBridgeModule.h" #import "SharkfoodMuteSwitchDetector.h" @interface RCTSilentSwitch : NSObject <RCTBridgeModule>
- I removed the
node_modulesdirectory and ran
yarn installand confirmed that the patch was applied. It printed the following messages at the end.
$ patch-package patch-package 6.1.2 Applying patches... email@example.com ✔
patch-package, I was able to make small changes in the
node_modules directory in a way that is CI friendly.
Although I used this approach for a react-native package, it can be used for any third-party package that is installed in