mirror of
https://github.com/zhigang1992/react-native-web.git
synced 2026-01-12 22:51:09 +08:00
[change] add Platform and Touchable to 'core' module
This commit is contained in:
@@ -27,14 +27,48 @@ the `url-loader` to the webpack config:
|
||||
module.exports = {
|
||||
// ...
|
||||
module: {
|
||||
loaders: {
|
||||
test: /\.(gif|jpe?g|png|svg)$/,
|
||||
loader: 'url-loader',
|
||||
query: { name: '[name].[hash:16].[ext]' }
|
||||
}
|
||||
loaders: [
|
||||
{
|
||||
test: /\.(gif|jpe?g|png|svg)$/,
|
||||
loader: 'url-loader',
|
||||
query: { name: '[name].[hash:16].[ext]' }
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
```
|
||||
|
||||
## Dependencies
|
||||
|
||||
Many OSS React Native packages are not compiled to ES5 before being published.
|
||||
This can result in webpack build errors. To avoid this issue you should
|
||||
configure webpack (or your bundler of choice) to run
|
||||
`babel-preset-react-native` over the necessary `node_module`. For example:
|
||||
|
||||
```js
|
||||
// webpack.config.js
|
||||
|
||||
module.exports = {
|
||||
// ...
|
||||
module: {
|
||||
loaders: [
|
||||
{
|
||||
// transpile to ES5
|
||||
test: /\.jsx?$/,
|
||||
include: [
|
||||
path.resolve(__dirname, 'src'),
|
||||
path.resolve(__dirname, 'node_modules/react-native-something')
|
||||
],
|
||||
loader: 'babel-loader',
|
||||
query: { cacheDirectory: true }
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
```
|
||||
|
||||
Please refer to the webpack documentation for more information.
|
||||
|
||||
## Web-specific code
|
||||
|
||||
Minor platform differences can use the `Platform` module.
|
||||
|
||||
@@ -16,8 +16,9 @@ module.exports = {
|
||||
}
|
||||
```
|
||||
|
||||
The `react-native-web` package also includes a `core` module that exports only
|
||||
`ReactNative`, `Image`, `StyleSheet`, `Text`, `TextInput`, and `View`.
|
||||
The `react-native-web` package also includes a `core` module that exports a
|
||||
subset of modules: `ReactNative`, `I18nManager`, `Platform`, `StyleSheet`,
|
||||
`Image`, `Text`, `TextInput`, `Touchable`, and `View`.
|
||||
|
||||
```js
|
||||
// webpack.config.js
|
||||
|
||||
10
src/core.js
10
src/core.js
@@ -6,12 +6,17 @@ ReactDefaultInjection.inject();
|
||||
|
||||
// APIs
|
||||
import I18nManager from './apis/I18nManager';
|
||||
import Platform from './apis/Platform';
|
||||
import StyleSheet from './apis/StyleSheet';
|
||||
|
||||
// components
|
||||
import Image from './components/Image';
|
||||
import Text from './components/Text';
|
||||
import TextInput from './components/TextInput';
|
||||
import Touchable from './components/Touchable/Touchable';
|
||||
import TouchableHighlight from './components/Touchable/TouchableHighlight';
|
||||
import TouchableOpacity from './components/Touchable/TouchableOpacity';
|
||||
import TouchableWithoutFeedback from './components/Touchable/TouchableWithoutFeedback';
|
||||
import View from './components/View';
|
||||
|
||||
// modules
|
||||
@@ -24,11 +29,16 @@ const ReactNativeCore = {
|
||||
unmountComponentAtNode,
|
||||
// APIs
|
||||
I18nManager,
|
||||
Platform,
|
||||
StyleSheet,
|
||||
// components
|
||||
Image,
|
||||
Text,
|
||||
TextInput,
|
||||
Touchable,
|
||||
TouchableHighlight,
|
||||
TouchableOpacity,
|
||||
TouchableWithoutFeedback,
|
||||
View
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user