Skip to content

Commit 827a0bd

Browse files
committed
Fix compatibility issue with react-native-web on non-expo projects
1 parent b430775 commit 827a0bd

File tree

4 files changed

+17
-10
lines changed

4 files changed

+17
-10
lines changed

README.md

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,16 @@ Drop-in RefreshControl component for web
1010
npm i react-native-web-refresh-control
1111
```
1212

13+
#### If you're using Expo
14+
You don't need to change anything else
15+
16+
#### If you're NOT using Expo
17+
You will need to configure webpack to parse JSX in `node_modules/react-native-web-refresh-control`.
18+
19+
1. Eject from `react-scripts` with `npm run eject`.
20+
2. Modify the main `babel-loader` module in `config/webpack.config.js`.
21+
* Replace `include: paths.appSrc,` with `include: [paths.appSrc, /node_modules\/react-native-web-refresh-control/],`
22+
1323
## Example
1424

1525
https://snack.expo.io/@niciusb/refreshcontrol-example
@@ -33,4 +43,4 @@ import App from './App'
3343
3444
patchFlatListProps()
3545
registerRootComponent(App)
36-
```
46+
```

package-lock.json

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-native-web-refresh-control",
3-
"version": "1.0.1",
3+
"version": "1.0.2",
44
"description": "An implementation of React Native's RefreshControl for web, since react-native-web currently does not provide one",
55
"main": "src/index.js",
66
"scripts": {

src/RefreshControl.web.js

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,6 @@ import {
66
Animated,
77
ActivityIndicator,
88
findNodeHandle,
9-
ViewPropTypes,
10-
ColorPropType,
119
} from 'react-native'
1210
import PropTypes from 'prop-types'
1311

@@ -170,17 +168,16 @@ function RefreshControl({
170168
}
171169

172170
RefreshControl.propTypes = {
173-
...ViewPropTypes,
174-
colors: PropTypes.arrayOf(ColorPropType),
171+
colors: PropTypes.array,
175172
enabled: PropTypes.bool,
176173
onRefresh: PropTypes.func,
177-
progressBackgroundColor: ColorPropType,
174+
progressBackgroundColor: PropTypes.any,
178175
progressViewOffset: PropTypes.number,
179176
refreshing: PropTypes.bool.isRequired,
180177
size: PropTypes.oneOf(['small', 'large']),
181-
tintColor: ColorPropType,
178+
tintColor: PropTypes.any,
182179
title: PropTypes.string,
183-
titleColor: ColorPropType,
180+
titleColor: PropTypes.any,
184181
}
185182

186183
export default RefreshControl

0 commit comments

Comments
 (0)