How to create a React Native app(2)? Setup by CLI

What extensions needed for VSCode?

  • copilot
  • ESLint
  • GitLens
  • Prettier
  • npm scripts

How to install React Native app?

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
npx react-native init MyApp --template react-native-template-typescript
npx react-native init MyApp --template react-native-template-typescript
npx react-native init MyApp --template react-native-template-typescript

How to config alias for relative path?

How to setup global variables?

  • Create globals.js
Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import { Platform } from 'react-native'
global.PLATFORM = Platform.OS
global.IS_ANDROID = Platform.OS === 'android'
global.IS_IOS = Platform.OS === 'ios'
global.IS_IPAD = Platform.OS === 'ios' && Platform.isPad
import { Platform } from 'react-native' global.PLATFORM = Platform.OS global.IS_ANDROID = Platform.OS === 'android' global.IS_IOS = Platform.OS === 'ios' global.IS_IPAD = Platform.OS === 'ios' && Platform.isPad
import { Platform } from 'react-native'

global.PLATFORM = Platform.OS
global.IS_ANDROID = Platform.OS === 'android'
global.IS_IOS = Platform.OS === 'ios'
global.IS_IPAD = Platform.OS === 'ios' && Platform.isPad
  • Import globals.js into root Component
Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import 'app/globals'
import 'app/globals'
import 'app/globals'
  • Edit .eslintrc
Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
{
"globals": {
"PLATFORM": true,
"IS_ANDROID": true,
"IS_IOS": true,
"IS_IPAD": true,
},
"extends": [...]
}
{ "globals": { "PLATFORM": true, "IS_ANDROID": true, "IS_IOS": true, "IS_IPAD": true, }, "extends": [...] }
{
   "globals": {
     "PLATFORM": true,
     "IS_ANDROID": true,
     "IS_IOS": true,
     "IS_IPAD": true,
   },
   "extends": [...]
}
  • Usage
Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
// TypeScript file
const globalAny: any = global
if (globalAny.IS_ANDROID) {
...
}
// TypeScript file const globalAny: any = global if (globalAny.IS_ANDROID) { ... }
// TypeScript file

const globalAny: any = global

if (globalAny.IS_ANDROID) {
  ...
}

How to config env file?

How to config storybook?

Be the first to comment

Leave a Reply

Your email address will not be published.


*