Skip to content

kuasha420/react-native-template-ts-plus

Repository files navigation

React Native Template TypeScript Plus

React Native TypeScript Template with Superpowers.

Features

  • Elegant usage directly within the React Native CLI
  • TypeScript Configured for Type safety and great Developer experience.
  • Built-in dark mode that follows system preference (Experimental) or in app preference.
  • Persistent Global State Management with Mobx State Tree and Async Storage using MST Persistent Store
  • Splash Screen Configured using React Native Bootsplash
  • Preconfigured Navigation System using React Navigation
  • Deep Linking and Universal Linking Enabled
  • Absolute Import using ~/ prefix.
  • React Native Paper & Vector Icons Installed & Pre-configured.
  • Easy version management with React Native Version
  • Integrated README on the generated project!

Usage

npx react-native init MyApp --template react-native-template-ts-plus

Or use custom App Name and/or directory

npx react-native init MyApp --title 'My App' --directory 'my-app' --template react-native-template-ts-plus

Usage with older versions of React Native

npx react-native init MyApp --template [email protected].*

See the below table to find out which version of the template to use.

React Native <=> Template Version

React Native Template
0.70.7 5.1.*
0.70.5 5.0.*
0.69.5 4.1.*
0.69.2 4.0.*
0.68.2 3.1.*
0.68.1 3.0.*
0.66.3 2.0.*
0.64.2 1.1.*
0.64.1 1.0.*

Troubleshooting

IOS

fatal error: 'openssl/opensslv.h' file not found

This should no longer happen on RN 0.68.1 and up (Template Version 3.0.0+).

This seems to happen on APFS Case Sensitive Filesystems when Flipper is enabled.

Solution 1 - Create Symbolic Links

Thanks to felexx90 for providing this solution.

Edit ios/Podfile and add the following lines inside post_install.

post_install do |installer|
    react_native_post_install(installer)
    # Fix OpenSSL-Universal on APFS Case Sensitive Filesystem
    system('cd Pods/Headers/Public; ln -s Protobuf protobuf')
    system('cd Pods/OpenSSL-Universal/Frameworks/OpenSSL.xcframework/ios-arm64_arm64e_armv7_armv7s; ln -sfh OpenSSL.framework openssl.framework')
    system('cd Pods/OpenSSL-Universal/Frameworks/OpenSSL.xcframework/ios-arm64_i386_x86_64-simulator; ln -sfh OpenSSL.framework openssl.framework')
    system('cd Pods/OpenSSL-Universal/Frameworks/OpenSSL.xcframework/ios-arm64_x86_64-maccatalyst; ln -sfh OpenSSL.framework openssl.framework')
    system('cd Pods/OpenSSL-Universal/Frameworks/OpenSSL.xcframework/macos-arm64_arm64e_x86_64; ln -sfh OpenSSL.framework openssl.framework')
  end

Now, reinstall pods.

cd ios && pod install

Solution 2 - Disable Flipper

If you do not need flipper you can just disable it to fix this error.

Edit ios/Podfile and comment out use_flipper!().

  # use_flipper!()

Now, reinstall pods and update repo.

cd ios && pod install --repo-update

Contributing

Contributions are very welcome. Please check out the contributing document.

License

This project is MIT licensed.

Credits

This repository and template is soft-forked from react-native-template-typescript .

All integrated and pre-configured libraries are the hard work of their respective authors and contributors.

The Awesome React Native Community