mirror of
https://github.com/zhigang1992/examples.git
synced 2026-04-30 18:32:50 +08:00
feat: add typescript example from new expo init
This commit is contained in:
4
with-typescript/.expo-shared/assets.json
Normal file
4
with-typescript/.expo-shared/assets.json
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
"f9155ac790fd02fadcdeca367b02581c04a353aa6d5aa84409a59f6804c87acd": true,
|
||||||
|
"89ed26367cdb9b771858e026f2eb95bfdb90e5ae943e716575327ec325f39c44": true
|
||||||
|
}
|
||||||
19
with-typescript/App.tsx
Normal file
19
with-typescript/App.tsx
Normal file
@@ -0,0 +1,19 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { StyleSheet, Text, View } from 'react-native';
|
||||||
|
|
||||||
|
export default function App() {
|
||||||
|
return (
|
||||||
|
<View style={styles.container}>
|
||||||
|
<Text>Open up App.tsx to start working on your app!</Text>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
container: {
|
||||||
|
flex: 1,
|
||||||
|
backgroundColor: '#fff',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
},
|
||||||
|
});
|
||||||
21
with-typescript/README.md
Normal file
21
with-typescript/README.md
Normal file
@@ -0,0 +1,21 @@
|
|||||||
|
# [TypeScript Example](https://www.typescriptlang.org/)
|
||||||
|
|
||||||
|
TypeScript is a superset of JavaScript which gives you static types and powerful tooling in Visual Studio Code including autocompletion and useful inline warnings for type errors.
|
||||||
|
|
||||||
|
### ⚽️ Getting started with TypeScript
|
||||||
|
|
||||||
|
#### Creating a new project**
|
||||||
|
|
||||||
|
- Install the CLI: `npm i -g expo-cli`
|
||||||
|
- Create a project: `expo init --template expo-template-blank-typescript`
|
||||||
|
- `cd` into the project
|
||||||
|
|
||||||
|
### Adding TypeScript to existing projects
|
||||||
|
|
||||||
|
- Copy the `tsconfig.json` from this repo, or new typescript template
|
||||||
|
- Add typescript dependencies: `yarn add --dev @types/react @types/react-native typescript`
|
||||||
|
- Rename files tpo TypeScript, `.tsx` for React components and `.ts` for plain typescript files
|
||||||
|
|
||||||
|
## 👀 More info
|
||||||
|
|
||||||
|
- [Expo TypeScript guide](https://docs.expo.io/versions/latest/guides/typescript/)
|
||||||
30
with-typescript/app.json
Normal file
30
with-typescript/app.json
Normal file
@@ -0,0 +1,30 @@
|
|||||||
|
{
|
||||||
|
"expo": {
|
||||||
|
"name": "with-typescript",
|
||||||
|
"slug": "with-typescript",
|
||||||
|
"privacy": "public",
|
||||||
|
"sdkVersion": "36.0.0",
|
||||||
|
"platforms": [
|
||||||
|
"ios",
|
||||||
|
"android",
|
||||||
|
"web"
|
||||||
|
],
|
||||||
|
"version": "1.0.0",
|
||||||
|
"orientation": "portrait",
|
||||||
|
"icon": "./assets/icon.png",
|
||||||
|
"splash": {
|
||||||
|
"image": "./assets/splash.png",
|
||||||
|
"resizeMode": "contain",
|
||||||
|
"backgroundColor": "#ffffff"
|
||||||
|
},
|
||||||
|
"updates": {
|
||||||
|
"fallbackToCacheTimeout": 0
|
||||||
|
},
|
||||||
|
"assetBundlePatterns": [
|
||||||
|
"**/*"
|
||||||
|
],
|
||||||
|
"ios": {
|
||||||
|
"supportsTablet": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
BIN
with-typescript/assets/icon.png
Normal file
BIN
with-typescript/assets/icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
with-typescript/assets/splash.png
Normal file
BIN
with-typescript/assets/splash.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
6
with-typescript/babel.config.js
Normal file
6
with-typescript/babel.config.js
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
module.exports = function(api) {
|
||||||
|
api.cache(true);
|
||||||
|
return {
|
||||||
|
presets: ['babel-preset-expo'],
|
||||||
|
};
|
||||||
|
};
|
||||||
26
with-typescript/package.json
Normal file
26
with-typescript/package.json
Normal file
@@ -0,0 +1,26 @@
|
|||||||
|
{
|
||||||
|
"main": "node_modules/expo/AppEntry.js",
|
||||||
|
"scripts": {
|
||||||
|
"start": "expo start",
|
||||||
|
"android": "expo start --android",
|
||||||
|
"ios": "expo start --ios",
|
||||||
|
"web": "expo start --web",
|
||||||
|
"eject": "expo eject"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"expo": "~36.0.0",
|
||||||
|
"react": "~16.9.0",
|
||||||
|
"react-dom": "~16.9.0",
|
||||||
|
"react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
|
||||||
|
"react-native-screens": "2.0.0-alpha.12",
|
||||||
|
"react-native-web": "~0.11.7"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@types/react": "~16.9.0",
|
||||||
|
"@types/react-native": "~0.60.23",
|
||||||
|
"@babel/core": "^7.0.0",
|
||||||
|
"babel-preset-expo": "~8.0.0",
|
||||||
|
"typescript": "~3.6.3"
|
||||||
|
},
|
||||||
|
"private": true
|
||||||
|
}
|
||||||
11
with-typescript/tsconfig.json
Normal file
11
with-typescript/tsconfig.json
Normal file
@@ -0,0 +1,11 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"allowSyntheticDefaultImports": true,
|
||||||
|
"jsx": "react-native",
|
||||||
|
"lib": ["dom", "esnext"],
|
||||||
|
"moduleResolution": "node",
|
||||||
|
"noEmit": true,
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"resolveJsonModule": true
|
||||||
|
}
|
||||||
|
}
|
||||||
5477
with-typescript/yarn.lock
Normal file
5477
with-typescript/yarn.lock
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user