|
@@ -2,20 +2,22 @@
|
2
|
2
|
|
3
|
3
|
**React Native WebView** is a modern, well-supported, and cross-platform WebView for React Native. It is intended to be a replacement for the built-in WebView (which will be [removed from core](https://github.com/react-native-community/discussions-and-proposals/pull/3)).
|
4
|
4
|
|
5
|
|
-**Please note that this package is pre-release and not yet ready for production use.**
|
6
|
|
-
|
7
|
5
|
## Platforms Supported
|
8
|
6
|
|
9
|
|
-* [x] iOS (both UIWebView and WKWebView)
|
10
|
|
-* [x] Android
|
11
|
|
-* [ ] Windows 10 (coming soon)
|
|
7
|
+- [x] iOS (both UIWebView and WKWebView)
|
|
8
|
+- [x] Android
|
|
9
|
+- [ ] Windows 10 (coming soon)
|
12
|
10
|
|
13
|
|
-## Getting Started
|
|
11
|
+## Versionning
|
|
12
|
+
|
|
13
|
+If you need the exact same Webview as the one from react-native, please use version **2.0.0**.
|
14
|
14
|
|
15
|
|
-*Note: this is currently a work-in-progress and not yet published to NPM.*
|
|
15
|
+_This package will then follow semver rules for the next releases._
|
|
16
|
+
|
|
17
|
+## Getting Started
|
16
|
18
|
|
17
|
19
|
```
|
18
|
|
-$ npm install --save https://github.com/react-native-community/react-native-webview
|
|
20
|
+$ yarn add react-native-webview
|
19
|
21
|
$ react-native link react-native-webview
|
20
|
22
|
```
|
21
|
23
|
|
|
@@ -26,19 +28,19 @@ Read our [Getting Started Guide](./docs/Getting-Started.md) for more.
|
26
|
28
|
Import the `WebView` component from `react-native-webview` and use it like so:
|
27
|
29
|
|
28
|
30
|
```jsx
|
29
|
|
-import React, { Component } from 'react'
|
30
|
|
-import { StyleSheet, Text, View } from 'react-native'
|
31
|
|
-import { WebView } from 'react-native-webview'
|
|
31
|
+import React, { Component } from 'react';
|
|
32
|
+import { StyleSheet, Text, View } from 'react-native';
|
|
33
|
+import { WebView } from 'react-native-webview';
|
32
|
34
|
|
33
|
35
|
// ...
|
34
|
36
|
class MyWebComponent extends Component {
|
35
|
|
- render () {
|
|
37
|
+ render() {
|
36
|
38
|
return (
|
37
|
39
|
<WebView
|
38
|
|
- source={{uri: "https://infinite.red/react-native"}}
|
39
|
|
- style={{marginTop: 20}}
|
|
40
|
+ source={{ uri: 'https://infinite.red/react-native' }}
|
|
41
|
+ style={{ marginTop: 20 }}
|
40
|
42
|
/>
|
41
|
|
- )
|
|
43
|
+ );
|
42
|
44
|
}
|
43
|
45
|
}
|
44
|
46
|
```
|
|
@@ -51,19 +53,19 @@ Simply install React Native WebView and then use it in place of the core WebView
|
51
|
53
|
|
52
|
54
|
### Contributor Notes
|
53
|
55
|
|
54
|
|
-* I've removed all PropTypes for now. Instead, we'll be using Flow types. TypeScript types will be added at a later date.
|
55
|
|
-* UIWebView is not tested fully and you will encounter some yellow warning boxes. Since it is deprecated, we don't intend to put a lot of time into supporting it, but feel free to submit PRs if you have a special use case. Note that you will need to specify `useWebKit={false}` to use UIWebView
|
56
|
|
-* After pulling this repo and installing all dependencies, you can run flow on iOS and Android-specific files using the commands:
|
57
|
|
- * `yarn flow` or `npm run flow` for iOS
|
58
|
|
- * `yarn flow-android` or `npm run flow-android` for Android
|
59
|
|
-* If you want to add another React Native platform to this repository, you will need to create another `.flowconfig` for it. If your platform is `example`, copy the main flowconfig and rename it to `.flowconfig.example`. Then edit the config to ignore other platforms, and add `.*/*[.]example.js` to the ignore lists of the other platforms. Then add an entry to `package.json` like this:
|
60
|
|
- * ` "flow-example": "flow check --flowconfig-name .flowconfig.example"`
|
61
|
|
-* Currently you need to install React Native 0.57 to be able to test these types - `flow check` will not pass against 0.56.
|
|
56
|
+- I've removed all PropTypes for now. Instead, we'll be using Flow types. TypeScript types will be added at a later date.
|
|
57
|
+- UIWebView is not tested fully and you will encounter some yellow warning boxes. Since it is deprecated, we don't intend to put a lot of time into supporting it, but feel free to submit PRs if you have a special use case. Note that you will need to specify `useWebKit={false}` to use UIWebView
|
|
58
|
+- After pulling this repo and installing all dependencies, you can run flow on iOS and Android-specific files using the commands:
|
|
59
|
+ - `yarn flow` or `npm run flow` for iOS
|
|
60
|
+ - `yarn flow-android` or `npm run flow-android` for Android
|
|
61
|
+- If you want to add another React Native platform to this repository, you will need to create another `.flowconfig` for it. If your platform is `example`, copy the main flowconfig and rename it to `.flowconfig.example`. Then edit the config to ignore other platforms, and add `.*/*[.]example.js` to the ignore lists of the other platforms. Then add an entry to `package.json` like this:
|
|
62
|
+ - `"flow-example": "flow check --flowconfig-name .flowconfig.example"`
|
|
63
|
+- Currently you need to install React Native 0.57 to be able to test these types - `flow check` will not pass against 0.56.
|
62
|
64
|
|
63
|
65
|
## Maintainers
|
64
|
66
|
|
65
|
|
-* [Jamon Holmgren](https://github.com/jamonholmgren) ([Twitter @jamonholmgren](https://twitter.com/jamonholmgren)) from [Infinite Red](https://infinite.red/react-native)
|
66
|
|
-* [Thibault Malbranche](https://github.com/Titozzz) ([Twitter @titozzz](https://twitter.com/titozzz)) from [Brigad](https://brigad.co/about)
|
|
67
|
+- [Jamon Holmgren](https://github.com/jamonholmgren) ([Twitter @jamonholmgren](https://twitter.com/jamonholmgren)) from [Infinite Red](https://infinite.red/react-native)
|
|
68
|
+- [Thibault Malbranche](https://github.com/Titozzz) ([Twitter @titozzz](https://twitter.com/titozzz)) from [Brigad](https://brigad.co/about)
|
67
|
69
|
|
68
|
70
|
## License
|
69
|
71
|
|