Skip to content

Commit fded536

Browse files
author
徐远翔
committedMay 29, 2020
feat: 支持添加自定义的分包,支持自定义页面转场过渡动画
1 parent 83c5098 commit fded536

File tree

16 files changed

+215
-20
lines changed

16 files changed

+215
-20
lines changed
 

‎.github/workflows/android.yml

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
name: Android Build
2+
3+
on:
4+
push:
5+
tags:
6+
- v*
7+
8+
jobs:
9+
build-android:
10+
runs-on: ubuntu-latest
11+
steps:
12+
- uses: actions/checkout@v2
13+
- name: Install npm dependencies
14+
run: cd example && yarn install
15+
- name: Test Android
16+
run: yarn e2e:android
17+
- name: Build Android Release
18+
run: yarn release:android
19+
- name: Upload Artifact
20+
uses: actions/upload-artifact@v1
21+
with:
22+
name: app-release.apk
23+
path: android/app/build/outputs/apk/release/

‎.github/workflows/ios.yml

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
name: Android E2E Tests
2+
3+
on:
4+
push:
5+
tags:
6+
- v*
7+
8+
jobs:
9+
test-android:
10+
runs-on: ubuntu-latest
11+
defaults:
12+
run:
13+
shell: bash
14+
working-directory: example
15+
steps:
16+
- uses: actions/checkout@v2
17+
- name: Install npm dependencies
18+
run: yarn install
19+
- name: Run e2e tests
20+
run: yarn e2e:android
21+
- name: Upload Artifact
22+
uses: actions/upload-artifact@v1
23+
with:
24+
name: app-release.apk
25+
path: android/app/build/outputs/apk/release/

‎example/.umirc.js

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
export default {
2+
dynamicImport: {
3+
loading: '@/components/Loading',
4+
},
5+
haul: {
6+
extraBundles: [
7+
{
8+
name: 'tabs/HomeScreen',
9+
entry: '@/tabs/HomeScreen.js',
10+
},
11+
{
12+
name: 'tabs/ProfileScreen',
13+
entry: '@/tabs/ProfileScreen.js',
14+
},
15+
],
16+
},
17+
};

‎example/android/app/build.gradle

+2-1
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,8 @@ import com.android.build.OutputFile
7979

8080
project.ext.react = [
8181
enableHermes: false, // clean and rebuild if changing,
82-
cliPath: "node_modules/@haul-bundler/cli/bin/haul.js"
82+
cliPath: "node_modules/@haul-bundler/cli/bin/haul.js",
83+
bundleCommand: "multi-bundle"
8384
]
8485

8586
apply from: "../../node_modules/react-native/react.gradle"

‎example/app.js

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import { TransitionPresets } from 'umi';
2+
3+
export function getReactNavigationDefaultScreenOptions() {
4+
/**
5+
* 查看 screenOptions 全字段:https://reactnavigation.org/docs/stack-navigator/#options
6+
*
7+
* 页面转场动画相关设置,可选值:
8+
* - ScaleFromCenterAndroid: Standard Android navigation transition when opening or closing an Activity on Android 10 (Q).
9+
* - RevealFromBottomAndroid: Standard Android navigation transition when opening or closing an Activity on Android 9 (Pie).
10+
* - FadeFromBottomAndroid: Standard Android navigation transition when opening or closing an Activity on Android < 9 (Oreo).
11+
* - SlideFromRightIOS: Standard iOS navigation transition
12+
* - ModalSlideFromBottomIOS: Standard iOS navigation transition for modals.
13+
* - ModalPresentationIOS: Standard iOS modal presentation style (introduced in iOS 13).
14+
* 根据当前平台(iOS/Android)自动探测:
15+
* - DefaultTransition: Default navigation transition for the current platform.
16+
* - ModalTransition: Default modal transition for the current platform.
17+
*/
18+
19+
// 统一 iOS/Android 页面动画为从右侧滑入
20+
return {
21+
...TransitionPresets.SlideFromRightIOS,
22+
};
23+
24+
// 也可以返回一个thunk函数
25+
// return ({ route }) => {
26+
// console.info('screenOptions:', route);
27+
// // 可以单独为某个路由设置:
28+
// if (route.name === '/login') {
29+
// // 比如为 /pages/login.js 页面设置为从底部滑入
30+
// return {
31+
// ...TransitionPresets.ModalSlideFromBottomIOS,
32+
// };
33+
// }
34+
//
35+
// return { ...TransitionPresets.SlideFromRightIOS };
36+
// };
37+
}

‎example/components/Loading.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import React from 'react';
2+
import { Text } from 'react-native';
3+
4+
export default function Loading({ error }) {
5+
if (error instanceof Error) {
6+
return <Text>加载失败</Text>;
7+
}
8+
9+
return <Text>正在加载...</Text>;
10+
}

‎example/e2e/app.spec.js

+8-2
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@ const timeout = 10000;
44

55
describe('RNUMITestApp', () => {
66
it('should render IndexPage', () => {
7+
const basicLayoutView = $('~basicLayoutView');
8+
expect(basicLayoutView.isDisplayed()).toBeTruthy();
9+
710
const linkToHome = $('~linkToHome');
811
linkToHome.waitForDisplayed({ timeout });
912
expect(linkToHome.getText()).toBe('Go to home');
@@ -14,14 +17,17 @@ describe('RNUMITestApp', () => {
1417
});
1518

1619
it('should navigate to HomePage with query params', () => {
20+
const basicLayoutView = $('~basicLayoutView');
21+
expect(basicLayoutView.isDisplayed()).toBeTruthy();
22+
1723
const linkToHome = $('~linkToHome');
1824
linkToHome.click();
1925

20-
const homeTitle = $('~homeTitle');
26+
const homeTitle = $('~homePageTitle');
2127
homeTitle.waitForDisplayed({ timeout });
2228
expect(homeTitle.getText()).toBe('Home Page');
2329

24-
const homeText = $('~homeText');
30+
const homeText = $('~homePageText');
2531
homeText.waitForDisplayed({ timeout });
2632
expect(homeText.getText()).toBe(JSON.stringify({ foo: 'bar' }));
2733
});

‎example/ios/RNUMITestApp.xcodeproj/project.pbxproj

+1-1
Original file line numberDiff line numberDiff line change
@@ -390,7 +390,7 @@
390390
);
391391
runOnlyForDeploymentPostprocessing = 0;
392392
shellPath = /bin/sh;
393-
shellScript = "# added by Haul\nexport CLI_PATH=node_modules/@haul-bundler/cli/bin/haul.js\nexport NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh";
393+
shellScript = "# added by Haul\nexport CLI_PATH=node_modules/@haul-bundler/cli/bin/haul.js\nexport BUNDLE_COMMAND=multi-bundle\nexport NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh\n";
394394
};
395395
07D69D39DD81CB26A8707F33 /* [CP] Check Pods Manifest.lock */ = {
396396
isa = PBXShellScriptBuildPhase;

‎example/layouts/index.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,12 @@
11
import React from 'react';
2+
import { View } from 'react-native';
23
import { BackButton } from 'umi';
4+
import { getTestProps } from '../services';
35

46
export default function Layout({ children }) {
5-
return <BackButton>{children}</BackButton>;
7+
return (
8+
<BackButton>
9+
<View {...getTestProps('basicLayoutView')}>{children}</View>
10+
</BackButton>
11+
);
612
}

‎example/package.json

+8-8
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,11 @@
77
"ios": "react-native run-ios",
88
"watch": "umi g rn --dev",
99
"start": "react-native start",
10-
"pree2e:run-android": "umi g rn",
11-
"e2e:build-android": "cd android && ./gradlew assembleDebug",
10+
"pree2e:android": "umi g rn",
11+
"e2e:build-android": "cd android && ./gradlew assembleRelease",
1212
"e2e:run-android": "wdio ./android.wdio.config.js --reporters",
1313
"e2e:android": "yarn e2e:build-android && yarn e2e:run-android",
14-
"pree2e:run-ios": "umi g rn",
14+
"pree2e:ios": "umi g rn",
1515
"e2e:build-ios": "cd ios && rm -rf build && /usr/bin/xcodebuild -sdk iphonesimulator -scheme RNUMITestApp -workspace RNUMITestApp.xcworkspace -configuration Debug archive -archivePath \"build/RNUMITestApp.xcarchive\" CODE_SIGN_IDENTITY=\"\" CODE_SIGNING_REQUIRED=NO CODE_SIGNING_ALLOWED=NO",
1616
"e2e:run-ios": "wdio ./ios.wdio.config.js --reporters",
1717
"e2e:ios": "yarn e2e:build-ios && yarn e2e:run-ios",
@@ -27,7 +27,7 @@
2727
"react-native-reanimated": "1.8.0",
2828
"react-native-safe-area-context": "1.0.0",
2929
"react-native-screens": "2.7.0",
30-
"umi-react-native-multibundle": "file:../packages/umi-react-native-multibundle"
30+
"umi-react-native-multibundle": "latest"
3131
},
3232
"devDependencies": {
3333
"@babel/core": "^7.6.2",
@@ -44,10 +44,10 @@
4444
"appium": "^1.17.1",
4545
"metro-react-native-babel-preset": "^0.58.0",
4646
"umi": "^3.2.1",
47-
"umi-plugin-antd-react-native": "file:../packages/umi-plugin-antd-react-native",
48-
"umi-preset-react-native": "file:../packages/umi-preset-react-native",
49-
"umi-preset-react-navigation": "file:../packages/umi-preset-react-navigation",
50-
"umi-renderer-react-navigation": "files:../packages/umi-renderer-react-navigation",
47+
"umi-plugin-antd-react-native": "latest",
48+
"umi-preset-react-native": "latest",
49+
"umi-preset-react-navigation": "latest",
50+
"umi-renderer-react-navigation": "latest",
5151
"webdriverio": "^6.1.12"
5252
}
5353
}

‎example/pages/home.js

+3-5
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,15 @@ import { View, Text } from 'react-native';
33
import { getTestProps } from '../services';
44

55
function HomePage({ route, navigation }) {
6-
if (__DEV__) {
7-
console.info('HomePage render:', route);
8-
}
96
useLayoutEffect(() => {
107
navigation.setOptions({
11-
headerTitle: () => <Text {...getTestProps('homeTitle')}>{HomePage.title}</Text>,
8+
headerTitle: () => <Text {...getTestProps('homePageTitle')}>{HomePage.title}</Text>,
129
});
1310
}, [navigation]);
11+
1412
return (
1513
<View>
16-
<Text {...getTestProps('homeText')}>{JSON.stringify(route.params)}</Text>
14+
<Text {...getTestProps('homePageText')}>{JSON.stringify(route.params)}</Text>
1715
</View>
1816
);
1917
}

‎example/pages/profile/settings/_layout.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,5 @@ import { View } from 'react-native';
33
import { getTestProps } from '../../../services';
44

55
export default function FeedBackLayout({ children }) {
6-
return <View {...getTestProps('feedBackLayoutView')}>{children}</View>;
6+
return <View {...getTestProps('feedbackLayoutView')}>{children}</View>;
77
}

‎example/pages/profile/settings/feedback.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,5 @@ import { Text } from 'react-native';
33
import { getTestProps } from '../../../services';
44

55
export default function FeedBackPage() {
6-
return <Text {...getTestProps('feedBackText')}>feedback</Text>;
6+
return <Text {...getTestProps('feedBackPageText')}>feedback</Text>;
77
}

‎example/tabs/HomeScreen.js

+48
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import React from 'react';
2+
import {Text, View} from 'react-native';
3+
import {Card, Grid, WhiteSpace, WingBlank} from '@ant-design/react-native';
4+
5+
const data = Array.from(new Array(12)).map((_val, i) => ({
6+
icon: 'https://os.alipayobjects.com/rmsportal/IptWdCkrtkAUfjE.png',
7+
text: `Name${i}`,
8+
}));
9+
10+
export default function HomeScreen() {
11+
return (
12+
<>
13+
<Grid data={data} columnNum={4} isCarousel />
14+
<WhiteSpace size="lg" />
15+
<WingBlank size="lg">
16+
<Card>
17+
<Card.Header
18+
title="This is title"
19+
thumbStyle={{width: 30, height: 30}}
20+
thumb="https://gw.alipayobjects.com/zos/rmsportal/MRhHctKOineMbKAZslML.jpg"
21+
extra="this is extra"
22+
/>
23+
<Card.Body>
24+
<View style={{height: 42}}>
25+
<Text style={{marginLeft: 16}}>Card Content</Text>
26+
</View>
27+
</Card.Body>
28+
<Card.Footer content="footer content" extra="footer extra content" />
29+
</Card>
30+
</WingBlank>
31+
<WhiteSpace size="lg" />
32+
<Card full>
33+
<Card.Header
34+
title="Full Column"
35+
thumbStyle={{width: 30, height: 30}}
36+
thumb="https://gw.alipayobjects.com/zos/rmsportal/MRhHctKOineMbKAZslML.jpg"
37+
extra="this is extra"
38+
/>
39+
<Card.Body>
40+
<View style={{height: 42}}>
41+
<Text style={{marginLeft: 16}}>Card Content</Text>
42+
</View>
43+
</Card.Body>
44+
<Card.Footer content="footer content" extra="footer extra content" />
45+
</Card>
46+
</>
47+
);
48+
}

‎example/tabs/ProfileScreen.js

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import React from 'react';
2+
import {Link} from 'umi';
3+
import {Icon, List} from '@ant-design/react-native';
4+
5+
export default function ProfileScreen() {
6+
return (
7+
<List>
8+
<Link
9+
to="/feedback"
10+
component={List.Item}
11+
arrow="horizontal"
12+
thumb={<Icon name="info-circle" />}>
13+
产品建议
14+
</Link>
15+
<Link
16+
to="/settings"
17+
component={List.Item}
18+
arrow="horizontal"
19+
thumb={<Icon name="setting" />}>
20+
设置
21+
</Link>
22+
</List>
23+
);
24+
}

‎packages/umi-preset-react-native/src/plugins/generateFiles/react-native/loading.ts

Whitespace-only changes.

0 commit comments

Comments
 (0)
Please sign in to comment.