Update documentation

This commit is contained in:
Nicolas Gallagher
2016-03-08 00:52:13 -08:00
parent e627e0cd77
commit 3eced7e842
3 changed files with 26 additions and 14 deletions

View File

@@ -2,7 +2,7 @@
[![Build Status][travis-image]][travis-url]
[![npm version][npm-image]][npm-url]
![gzipped size](https://img.shields.io/badge/gzipped-~23k-blue.svg)
![gzipped size](https://img.shields.io/badge/gzipped-~36.4k-blue.svg)
[React Native][react-native-url] components and APIs for the Web.

View File

@@ -12,17 +12,10 @@ cases it will be necessary to use a Web counterpart.
## Missing component props
There are properties that do not work across all platforms. All web-specific
props are annotated with `(web)` in the documentaiton.
props are annotated with `(web)` in the documentation.
## Platform parity
There are some known issues in React Native where APIs could be made more
consistent between platforms. For example, React Native for Web includes
`ActivityIndicator` and a horizontal `ProgressBar`.
Other parts of React Native, such as the `Animated` and `PanResponder` APIs,
are highly complex and have not yet been ported to React Native for Web. Given
the difficulties keeping these APIs in sync with React Native, we'd prefer the
APIs to be published as separate npm packages. If not, we will consider a web
implementation, possibly using the [Web Animations
API/polyfill](https://github.com/web-animations/web-animations-js)

View File

@@ -1,8 +1,5 @@
# React Native
This is an experimental feature to support: using community-developed React
Native components on the Web; and rendering React Native apps to Web.
Use a module loader that supports package aliases (e.g., webpack), and alias
`react-native` to `react-native-web`.
@@ -10,6 +7,7 @@ Use a module loader that supports package aliases (e.g., webpack), and alias
// webpack.config.js
module.exports = {
// ...
resolve: {
alias: {
'react-native': 'react-native-web'
@@ -18,8 +16,7 @@ module.exports = {
}
```
Web-specific implementations can use the `*.web.js` naming pattern, which
webpack will resolve.
## Web-specific code
Minor platform differences can use the `Platform` module.
@@ -38,3 +35,25 @@ if (Platform.OS === 'web') {
});
}
```
More substantial Web-specific implementation code should be written in files
with the extension `.web.js`, which webpack will automatically resolve.
## Optimizations
Production builds can benefit from dead-code elimination by defining the
following variables:
```js
// webpack.config.js
module.exports = {
// ...
plugins: [
new webpack.DefinePlugin({
'Platform.OS': 'web',
'process.env.NODE_ENV': JSON.stringify('production')
})
}
}
```