智慧社区原生项目
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

211 lines
7.7 KiB

3 years ago
# Taro Native Shell
3 years ago
参考文档:[Taro React Native 端开发流程 - 分离模式](https://docs.taro.zone/docs/react-native#%E5%88%86%E7%A6%BB%E6%A8%A1%E5%BC%8F)
3 years ago
Taro 原生 React Native 壳工程,和 React Native init 的工程的区别如下:
3 years ago
0. 集成了 [expo](https://docs.expo.dev/bare/installing-expo-modules/)
1. 集成了 Taro 依赖的所有原生库
2 years ago
2. debug 方式变更: 在 JS 工程中 `pnpm dev:rn` 启动 metro server
3. release 方式变更: 在 JS 工程中 `pnpm buid:rn` 打包 jsbundle 并通过配置 `rn.output` 输出到壳工程
3 years ago
## 该仓库如何生成
3 years ago
1. 使用 `react-native` [初始化项目](https://reactnative.dev/docs/environment-setup)
```
3 years ago
npx react-native init taroDemo --version 0.73.0
```
3 years ago
2. 使用 `expo-cli` [自动安装 expo](https://docs.expo.dev/bare/installing-expo-modules/#automatic-installation)
3 years ago
```
npx install-expo-modules@latest
```
3 years ago
3. 修改部分代码以支持 Taro,此部分可以直接 cherry-pick
- [scripts] 修改 `android`, `ios` 脚本,增加 `upgradePeerdeps` 脚本
- [devDependencies] 增加 `install-peerdeps``pod-install`
- [ios] 添加相关 APP 权限说明
- [ios] 使用亮色主题
- [android] 添加国内 maven 源
- [android] 添加 gif 支持
- [android] 注释原 react native 打包
- [android] 使用亮色主题
- [docs] 复制该 `README.md` 文件
- [license] 复制 LICENSE 文件
3 years ago
4. 更新 Taro 需要的依赖(如果还没正式发布,则使用对应的 alpha 或 beta 版本)
3 years ago
```
2 years ago
pnpm
pnpm upgradePeerdeps
3 years ago
```
5. 添加打包脚本,此部分可以直接 cherry-pick
- [fastlane] 添加 Android、iOS fastlane 配置
- [actions] 添加 Android、iOS 打包脚本
- [ios] 添加默认图标
- [ios] 添加 ITSAppUsesNonExemptEncryption false
- [ios] 添加 main.jsbundle assets 引用
3 years ago
## React Native 小版本更新
3 years ago
https://react-native-community.github.io/upgrade-helper/
3 years ago
## Taro 版本更新
3 years ago
> 使用 Taro 最新版,或者修改 `upgradePeerdeps` 指定 Taro 版本,再执行:
```
2 years ago
pnpm upgradePeerdeps
3 years ago
```
## 附:Taro 原生依赖明细表
> 由 [feat-add-dep-analysis-scripte](https://github.com/wuba/taro-react-native/tree/feat-add-dep-analysis-scripte) 脚本生成,如需裁剪壳工程,可参考此附录。
### taro-rn
```js
{
authorize: Set(3) {
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'expo-location@~16.5.1'
},
chooseImage: Set(4) {
'@react-native-camera-roll/camera-roll@~7.2.0',
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'react-native-safe-area-context@~4.8.0'
},
chooseMedia: Set(4) {
'@react-native-camera-roll/camera-roll@~7.2.0',
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'react-native-safe-area-context@~4.8.0'
},
chooseVideo: Set(4) {
'@react-native-camera-roll/camera-roll@~7.2.0',
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'react-native-safe-area-context@~4.8.0'
},
clearStorage: Set(1) { '@react-native-async-storage/async-storage@~1.21.0' },
compressImage: Set(1) { '@bam.tech/react-native-image-resizer@~3.0.5' },
createCameraContext: Set(1) { 'expo-camera@~14.0.0' },
createInnerAudioContext: Set(1) { 'expo-av@~13.10.0' },
downloadFile: Set(1) { 'expo-file-system@~16.0.0' },
getAppBaseInfo: Set(1) { 'react-native-device-info@~10.12.0' },
getClipboardData: Set(1) { '@react-native-clipboard/clipboard@~1.13.0' },
getFileInfo: Set(1) { 'expo-file-system@~16.0.0' },
getLocation: Set(2) {
'@react-native-community/geolocation@~3.1.0',
'expo-location@~16.5.1'
},
getNetworkType: Set(1) { '@react-native-community/netinfo@~11.2.0' },
getRecorderManager: Set(2) { 'expo-av@~13.10.0', 'expo-file-system@~16.0.0' },
getSavedFileInfo: Set(1) { 'expo-file-system@~16.0.0' },
getSavedFileList: Set(1) { 'expo-file-system@~16.0.0' },
getScreenBrightness: Set(1) { 'expo-brightness@~11.8.0' },
getSetting: Set(3) {
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'expo-location@~16.5.1'
},
getStorage: Set(1) { '@react-native-async-storage/async-storage@~1.21.0' },
getStorageInfo: Set(1) { '@react-native-async-storage/async-storage@~1.21.0' },
getSystemInfo: Set(2) {
'react-native-safe-area-context@~4.8.0',
'react-native-device-info@~10.12.0'
},
getSystemInfoSync: Set(2) {
'react-native-safe-area-context@~4.8.0',
'react-native-device-info@~10.12.0'
},
offAccelerometerChange: Set(1) { 'expo-sensors@~12.9.0' },
offDeviceMotionChange: Set(1) { 'expo-sensors@~12.9.0' },
offGyroscopeChange: Set(1) { 'expo-sensors@~12.9.0' },
offLocationChange: Set(1) { '@react-native-community/geolocation@~3.1.0' },
offNetworkStatusChange: Set(1) { '@react-native-community/netinfo@~11.2.0' },
onAccelerometerChange: Set(1) { 'expo-sensors@~12.9.0' },
onDeviceMotionChange: Set(1) { 'expo-sensors@~12.9.0' },
onGyroscopeChange: Set(1) { 'expo-sensors@~12.9.0' },
onLocationChange: Set(1) { '@react-native-community/geolocation@~3.1.0' },
onNetworkStatusChange: Set(1) { '@react-native-community/netinfo@~11.2.0' },
openSetting: Set(3) {
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'expo-location@~16.5.1'
},
previewImage: Set(5) {
'@react-native-camera-roll/camera-roll@~7.2.0',
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'react-native-safe-area-context@~4.8.0',
'expo-file-system@~16.0.0'
},
removeSavedFile: Set(1) { 'expo-file-system@~16.0.0' },
removeStorage: Set(1) { '@react-native-async-storage/async-storage@~1.21.0' },
saveFile: Set(1) { 'expo-file-system@~16.0.0' },
saveImageToPhotosAlbum: Set(4) {
'@react-native-camera-roll/camera-roll@~7.2.0',
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'react-native-safe-area-context@~4.8.0'
},
saveVideoToPhotosAlbum: Set(4) {
'@react-native-camera-roll/camera-roll@~7.2.0',
'expo-camera@~14.0.0',
'expo-image-picker@~14.7.0',
'react-native-safe-area-context@~4.8.0'
},
scanCode: Set(5) {
'react-native-safe-area-context@~4.8.0',
'expo-camera@~14.0.0',
'expo-barcode-scanner@~12.9.0',
'@react-native-camera-roll/camera-roll@~7.2.0',
'expo-image-picker@~14.7.0'
},
setClipboardData: Set(1) { '@react-native-clipboard/clipboard@~1.13.0' },
setKeepScreenOn: Set(1) { 'expo-keep-awake@~12.8.0' },
setScreenBrightness: Set(1) { 'expo-brightness@~11.8.0' },
setStorage: Set(1) { '@react-native-async-storage/async-storage@~1.21.0' },
showActionSheet: Set(1) { 'react-native-safe-area-context@~4.8.0' },
startAccelerometer: Set(1) { 'expo-sensors@~12.9.0' },
startDeviceMotionListening: Set(1) { 'expo-sensors@~12.9.0' },
startGyroscope: Set(1) { 'expo-sensors@~12.9.0' },
startLocationUpdate: Set(1) { '@react-native-community/geolocation@~3.1.0' },
stopAccelerometer: Set(1) { 'expo-sensors@~12.9.0' },
stopDeviceMotionListening: Set(1) { 'expo-sensors@~12.9.0' },
stopGyroscope: Set(1) { 'expo-sensors@~12.9.0' },
stopLocationUpdate: Set(1) { '@react-native-community/geolocation@~3.1.0' },
uploadFile: Set(1) { 'expo-file-system@~16.0.0' }
}
```
### taro-components-rn
```js
{
Camera: Set(3) {
'expo@~50.0.2',
'expo-camera@~14.0.0',
'expo-barcode-scanner@~12.9.0'
},
Image: Set(1) { 'react-native-svg@~14.1.0' },
Picker: Set(1) { '@react-native-picker/picker@~2.6.1' },
PickerView: Set(1) { '@react-native-picker/picker@~2.6.1' },
RichText: Set(1) { 'react-native-webview@~13.6.3' },
Slider: Set(1) { '@react-native-community/slider@~4.4.2' },
Swiper: Set(1) { 'react-native-pager-view@~6.2.0' },
Video: Set(3) {
'expo@~50.0.2',
'expo-av@~13.10.0',
'react-native-svg@~14.1.0'
},
CoverImage: Set(1) { 'react-native-svg@~14.1.0' },
WebView: Set(1) { 'react-native-webview@~13.6.3' }
}
```