tsrntemp 1.1.3 → 1.2.0

package/README.md

@@ -1,48 +1,51 @@
-## :space_invader: React Native Template TypeScript
-
-## :arrow_forward: 用法
-```sh
-npx react-native init ProjectName --template tsrntemp
-```
-
-#### React Native <=> Template Version
-
-| React Native | Template |
-| ------------ | -------- |
-| 0.71         | 1.1.\*   |
-| 0.67         | 1.0.\*   |
-
-`本项目默认为TS搭建，集成路由，缓存，请求工具、icon工具`
-
-- 文件目录
- - src
-  - src/assets`静态资源文件夹`
-  - src/components`公用组件文件夹`
-  - src/config`配置文件夹`
-  - src/iconfont`图标字体文件夹`
-  - src/pages`所有页面文件夹`
-  - src/route`路由页面文件夹`
-  - src/types`类型申明文件夹`
-  - src/utils`工具类文件夹`
-
-### react-navigation
-- [具体使用参照](https://reactnavigation.org/docs/getting-started)
-
-##### icont使用
-- 根目录下有一个iconfont.json文件
-- [具体使用参照](https://www.npmjs.com/package/react-native-iconfont-cli)
-
-
-##### requset
-- 使用的请求库为umi-reuest
-- [具体使用参照](https://www.npmjs.com/package/umi-request)
-
-##### 缓存
-- 使用utils/storage
-- [具体使用参照](https://react-native-async-storage.github.io/async-storage/docs/usage)
-
-
-##### 适配
-- 使用的react-native-size-matters
-- [具体使用参照](https://www.npmjs.com/package/react-native-size-matters)
-
+## :space_invader: React Native Template TypeScript
+
+English | [简体中文](./README_zh-CN.md)
+
+## :arrow_forward: 用法
+```sh
+npx react-native init ProjectName --template tsrntemp
+```
+
+#### React Native <=> Template Version
+
+| React Native | Template |
+| ------------ | -------- |
+| 0.72         | 1.2.\*   |
+| 0.71         | 1.1.\*   |
+| 0.67         | 1.0.\*   |
+
+`The default of this project is TS building, integrated routing, caching, request tool and icon tool`
+
+- 文件目录
+ - src
+  - src/assets`Static resource folder`
+  - src/components`Public component folder`
+  - src/config`Configuration folder`
+  - src/iconfont`Icon font folder`
+  - src/pages`All of the page folders`
+  - src/route`Route the page folder`
+  - src/types`Type statement folder`
+  - src/utils`Tool Class Folders`
+
+### react-navigation
+- [Use reference](https://reactnavigation.org/docs/getting-started)
+
+##### icont
+- The configuration file for the icon is the iconfont.json file located in the root directory
+- [Use reference](https://www.npmjs.com/package/react-native-iconfont-cli)
+
+
+##### requset
+- The request library used is `umi-reuest`
+- [Use reference](https://www.npmjs.com/package/umi-request)
+
+##### storage
+- The cache library used is `react-native-mmkv` and is a library that returns data directly, unlike the promise that `async-storage` is returned
+- [Use reference](https://github.com/mrousavy/react-native-mmkv/blob/master/README.md)
+
+
+##### size-matters
+- Size adaptation
+- [Use reference](https://www.npmjs.com/package/react-native-size-matters)
+

package/package.json

@@ -1,34 +1,34 @@
-{
-  "name": "tsrntemp",
-  "version": "1.1.3",
-  "description": "Clean and minimalist React Native template for a quick start with TypeScript.",
-  "scripts": {
-    "test": "exit 0"
-  },
-  "files": [
-    "template",
-    "template.config.js"
-  ],
-  "keywords": [
-    "react-native",
-    "typescript",
-    "jest",
-    "template",
-    "boilerplate"
-  ],
-  "author": {
-    "name": "wangzelin",
-    "url": "https://juejin.cn/user/465848662767367?utm_source=gold_browser_extension"
-  },
-  "contributors": [
-    {
-      "name": "wangzelin",
-      "url": "https://juejin.cn/user/465848662767367?utm_source=gold_browser_extension"
-    }
-  ],
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/wanngzelin/RNTemplate/issues"
-  },
-  "homepage": "https://github.com/wanngzelin/RNTemplate#readme"
+{
+  "name": "tsrntemp",
+  "version": "1.2.0",
+  "description": "Clean and minimalist React Native template for a quick start with TypeScript.",
+  "scripts": {
+    "test": "exit 0"
+  },
+  "files": [
+    "template",
+    "template.config.js"
+  ],
+  "keywords": [
+    "react-native",
+    "typescript",
+    "jest",
+    "template",
+    "boilerplate"
+  ],
+  "author": {
+    "name": "wangzelin",
+    "url": "https://juejin.cn/user/465848662767367?utm_source=gold_browser_extension"
+  },
+  "contributors": [
+    {
+      "name": "wangzelin",
+      "url": "https://juejin.cn/user/465848662767367?utm_source=gold_browser_extension"
+    }
+  ],
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/wanngzelin/RNTemplate/issues"
+  },
+  "homepage": "https://github.com/wanngzelin/RNTemplate#readme"
 }

package/template/.eslintrc.js

@@ -1,4 +1,4 @@
 module.exports = {
   root: true,
-  extends: '@react-native-community',
+  extends: '@react-native',
 };

package/template/.watchmanconfig

@@ -1 +1 @@
-{}
+{}

package/template/App.tsx

@@ -4,15 +4,12 @@
  *
  * @format
  */
-
+import 'react-native-gesture-handler';
 import React from 'react';
-import RouterContainer from 'route/RouteContainer';
-
+import RouterContainer from '@/route/RouterContainer';
 
-function App(): JSX.Element {
-  return (
-    <RouterContainer />
-  );
-}
+const App: React.FC = () => {
+  return <RouterContainer />;
+};
 
 export default App;

package/template/Gemfile

@@ -1,6 +1,9 @@
 source 'https://rubygems.org'
 
 # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
-ruby File.read(File.join(__dir__, '.ruby-version')).strip
+ruby ">= 2.6.10"
 
-gem 'cocoapods', '~> 1.11', '>= 1.11.3'
+# Cocoapods 1.15 introduced a bug which break the build. We will remove the upper
+# bound in the template on Cocoapods with next React Native release.
+gem 'cocoapods', '>= 1.13', '< 1.15'
+gem 'activesupport', '>= 6.1.7.3', '< 7.1.0'

package/template/README.md

@@ -0,0 +1,51 @@
+## :space_invader: React Native Template TypeScript
+
+English | [简体中文](./README_zh-CN.md)
+
+## :arrow_forward: 用法
+```sh
+npx react-native init ProjectName --template tsrntemp
+```
+
+#### React Native <=> Template Version
+
+| React Native | Template |
+| ------------ | -------- |
+| 0.72         | 1.2.\*   |
+| 0.71         | 1.1.\*   |
+| 0.67         | 1.0.\*   |
+
+`The default of this project is TS building, integrated routing, caching, request tool and icon tool`
+
+- 文件目录
+ - src
+  - src/assets`Static resource folder`
+  - src/components`Public component folder`
+  - src/config`Configuration folder`
+  - src/iconfont`Icon font folder`
+  - src/pages`All of the page folders`
+  - src/route`Route the page folder`
+  - src/types`Type statement folder`
+  - src/utils`Tool Class Folders`
+
+### react-navigation
+- [Use reference](https://reactnavigation.org/docs/getting-started)
+
+##### icont
+- The configuration file for the icon is the iconfont.json file located in the root directory
+- [Use reference](https://www.npmjs.com/package/react-native-iconfont-cli)
+
+
+##### requset
+- The request library used is `umi-reuest`
+- [Use reference](https://www.npmjs.com/package/umi-request)
+
+##### storage
+- The cache library used is `react-native-mmkv` and is a library that returns data directly, unlike the promise that `async-storage` is returned
+- [Use reference](https://github.com/mrousavy/react-native-mmkv/blob/master/README.md)
+
+
+##### size-matters
+- Size adaptation
+- [Use reference](https://www.npmjs.com/package/react-native-size-matters)
+

package/template/README_zh-CN.md

@@ -0,0 +1,51 @@
+## :space_invader: React Native Template TypeScript
+
+[English](./README.md) | 简体中文
+
+## :arrow_forward: 用法
+```sh
+npx react-native init ProjectName --template tsrntemp
+```
+
+#### React Native <=> Template Version
+
+| React Native | Template |
+| ------------ | -------- |
+| 0.72         | 1.2.\*   |
+| 0.71         | 1.1.\*   |
+| 0.67         | 1.0.\*   |
+
+`本项目默认为TS搭建，集成路由，缓存，请求工具、icon工具`
+
+- 文件目录
+ - src
+  - src/assets`静态资源文件夹`
+  - src/components`公用组件文件夹`
+  - src/config`配置文件夹`
+  - src/iconfont`图标字体文件夹`
+  - src/pages`所有页面文件夹`
+  - src/route`路由页面文件夹`
+  - src/types`类型申明文件夹`
+  - src/utils`工具类文件夹`
+
+### react-navigation
+- [具体使用参照](https://reactnavigation.org/docs/getting-started)
+
+##### icont使用
+- icon的配置文件是`根目录下的 iconfont.json`
+- [具体使用参照](https://www.npmjs.com/package/react-native-iconfont-cli)
+
+
+##### requset
+- 使用的请求库为umi-reuest
+- [具体使用参照](https://www.npmjs.com/package/umi-request)
+
+##### 缓存
+- 使用的缓存为`react-native-mmkv`，直接返回数据，而不是`async-storage`库，返回的promise
+- [具体使用参照](https://github.com/mrousavy/react-native-mmkv/blob/master/README.md)
+
+
+##### 适配
+- 使用的react-native-size-matters
+- [具体使用参照](https://www.npmjs.com/package/react-native-size-matters)
+

package/template/__tests__/{App-test.tsx → App.test.tsx}

@@ -6,6 +6,9 @@ import 'react-native';
 import React from 'react';
 import App from '../App';
 
+// Note: import explicitly to use the types shiped with jest.
+import {it} from '@jest/globals';
+
 // Note: test renderer must be required after react-native.
 import renderer from 'react-test-renderer';
 

package/template/android/app/build.gradle

@@ -1,8 +1,6 @@
 apply plugin: "com.android.application"
 apply plugin: "com.facebook.react"
 
-import com.android.build.OutputFile
-
 /**
  * This is the configuration block to customize your React Native Android app.
  * By default you don't need to apply any configuration, just uncomment the lines you need.
@@ -13,8 +11,8 @@ react {
     // root = file("../")
     //   The folder where the react-native NPM package is. Default is ../node_modules/react-native
     // reactNativeDir = file("../node_modules/react-native")
-    //   The folder where the react-native Codegen package is. Default is ../node_modules/react-native-codegen
-    // codegenDir = file("../node_modules/react-native-codegen")
+    //   The folder where the react-native Codegen package is. Default is ../node_modules/@react-native/codegen
+    // codegenDir = file("../node_modules/@react-native/codegen")
     //   The cli.js file which is the React Native CLI entrypoint. Default is ../node_modules/react-native/cli.js
     // cliFile = file("../node_modules/react-native/cli.js")
 
@@ -52,14 +50,6 @@ react {
     // hermesFlags = ["-O", "-output-source-map"]
 }
 
-/**
- * Set this to true to create four separate APKs instead of one,
- * one for each native architecture. This is useful if you don't
- * use App Bundles (https://developer.android.com/guide/app-bundle/)
- * and want to have separate APKs to upload to the Play Store.
- */
-def enableSeparateBuildPerCPUArchitecture = false
-
 /**
  * Set this to true to Run Proguard on Release builds to minify the Java bytecode.
  */
@@ -78,16 +68,6 @@ def enableProguardInReleaseBuilds = false
  */
 def jscFlavor = 'org.webkit:android-jsc:+'
 
-/**
- * Private function to get the list of Native Architectures you want to build.
- * This reads the value from reactNativeArchitectures in your gradle.properties
- * file and works together with the --active-arch-only flag of react-native run-android.
- */
-def reactNativeArchitectures() {
-    def value = project.getProperties().get("reactNativeArchitectures")
-    return value ? value.split(",") : ["armeabi-v7a", "x86", "x86_64", "arm64-v8a"]
-}
-
 android {
     ndkVersion rootProject.ext.ndkVersion
 
@@ -101,15 +81,6 @@ android {
         versionCode 1
         versionName "1.0"
     }
-
-    splits {
-        abi {
-            reset()
-            enable enableSeparateBuildPerCPUArchitecture
-            universalApk false  // If true, also generate a universal APK
-            include (*reactNativeArchitectures())
-        }
-    }
     signingConfigs {
         debug {
             storeFile file('debug.keystore')
@@ -130,30 +101,12 @@ android {
             proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
         }
     }
-
-    // applicationVariants are e.g. debug, release
-    applicationVariants.all { variant ->
-        variant.outputs.each { output ->
-            // For each separate APK per architecture, set a unique version code as described here:
-            // https://developer.android.com/studio/build/configure-apk-splits.html
-            // Example: versionCode 1 will generate 1001 for armeabi-v7a, 1002 for x86, etc.
-            def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
-            def abi = output.getFilter(OutputFile.ABI)
-            if (abi != null) {  // null for the universal-debug, universal-release variants
-                output.versionCodeOverride =
-                        defaultConfig.versionCode * 1000 + versionCodes.get(abi)
-            }
-
-        }
-    }
 }
 
 dependencies {
     // The version of react-native is set by the React Native Gradle Plugin
     implementation("com.facebook.react:react-android")
 
-    implementation("androidx.swiperefreshlayout:swiperefreshlayout:1.0.0")
-
     debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}")
     debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
         exclude group:'com.squareup.okhttp3', module:'okhttp'

package/template/android/app/src/main/java/com/template/MainActivity.java

@@ -4,6 +4,7 @@ import com.facebook.react.ReactActivity;
 import com.facebook.react.ReactActivityDelegate;
 import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint;
 import com.facebook.react.defaults.DefaultReactActivityDelegate;
+
 import android.os.Bundle;
 
 public class MainActivity extends ReactActivity {
@@ -28,11 +29,9 @@ public class MainActivity extends ReactActivity {
         this,
         getMainComponentName(),
         // If you opted-in for the New Architecture, we enable the Fabric Renderer.
-        DefaultNewArchitectureEntryPoint.getFabricEnabled(), // fabricEnabled
-        // If you opted-in for the New Architecture, we enable Concurrent React (i.e. React 18).
-        DefaultNewArchitectureEntryPoint.getConcurrentReactEnabled() // concurrentRootEnabled
-        );
+        DefaultNewArchitectureEntryPoint.getFabricEnabled());
   }
+
   @Override
   protected void onCreate(Bundle savedInstanceState) {
     super.onCreate(null);

package/template/android/app/src/main/res/drawable/rn_edit_text_material.xml

@@ -20,7 +20,7 @@
        android:insetBottom="@dimen/abc_edit_text_inset_bottom_material">
 
     <selector>
-        <!-- 
+        <!--
           This file is a copy of abc_edit_text_material (https://bit.ly/3k8fX7I).
           The item below with state_pressed="false" and state_focused="false" causes a NullPointerException.
           NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'

package/template/android/build.gradle

@@ -15,7 +15,7 @@ buildscript {
         mavenCentral()
     }
     dependencies {
-        classpath("com.android.tools.build:gradle:7.3.1")
+        classpath("com.android.tools.build:gradle")
         classpath("com.facebook.react:react-native-gradle-plugin")
     }
 }

package/template/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,5 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.5.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.0.1-all.zip
+networkTimeout=10000
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

package/template/android/gradle.properties

@@ -25,7 +25,7 @@ android.useAndroidX=true
 android.enableJetifier=true
 
 # Version of flipper SDK to use with React Native
-FLIPPER_VERSION=0.125.0
+FLIPPER_VERSION=0.182.0
 
 # Use this property to specify which architecture you want to build.
 # You can also override it from the CLI using

package/template/android/gradlew

@@ -55,7 +55,7 @@
 #       Darwin, MinGW, and NonStop.
 #
 #   (3) This script is generated from the Groovy template
-#       https://github.com/gradle/gradle/blob/master/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       https://github.com/gradle/gradle/blob/HEAD/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
 #       within the Gradle project.
 #
 #       You can find Gradle at https://github.com/gradle/gradle/.
@@ -80,10 +80,10 @@ do
     esac
 done
 
-APP_HOME=$( cd "${APP_HOME:-./}" && pwd -P ) || exit
-
-APP_NAME="Gradle"
+# This is normally unused
+# shellcheck disable=SC2034
 APP_BASE_NAME=${0##*/}
+APP_HOME=$( cd "${APP_HOME:-./}" && pwd -P ) || exit
 
 # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
 DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
@@ -143,12 +143,16 @@ fi
 if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
     case $MAX_FD in #(
       max*)
+        # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.
+        # shellcheck disable=SC3045 
         MAX_FD=$( ulimit -H -n ) ||
             warn "Could not query maximum file descriptor limit"
     esac
     case $MAX_FD in  #(
       '' | soft) :;; #(
       *)
+        # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.
+        # shellcheck disable=SC3045 
         ulimit -n "$MAX_FD" ||
             warn "Could not set maximum file descriptor limit to $MAX_FD"
     esac
@@ -205,6 +209,12 @@ set -- \
         org.gradle.wrapper.GradleWrapperMain \
         "$@"
 
+# Stop when "xargs" is not available.
+if ! command -v xargs >/dev/null 2>&1
+then
+    die "xargs is not available"
+fi
+
 # Use "xargs" to parse quoted args.
 #
 # With -n1 it outputs one arg per line, with the quotes and backslashes removed.

package/template/android/gradlew.bat

@@ -14,7 +14,7 @@
 @rem limitations under the License.
 @rem
 
-@if "%DEBUG%" == "" @echo off
+@if "%DEBUG%"=="" @echo off
 @rem ##########################################################################
 @rem
 @rem  Gradle startup script for Windows
@@ -25,7 +25,8 @@
 if "%OS%"=="Windows_NT" setlocal
 
 set DIRNAME=%~dp0
-if "%DIRNAME%" == "" set DIRNAME=.
+if "%DIRNAME%"=="" set DIRNAME=.
+@rem This is normally unused
 set APP_BASE_NAME=%~n0
 set APP_HOME=%DIRNAME%
 
@@ -40,7 +41,7 @@ if defined JAVA_HOME goto findJavaFromJavaHome
 
 set JAVA_EXE=java.exe
 %JAVA_EXE% -version >NUL 2>&1
-if "%ERRORLEVEL%" == "0" goto execute
+if %ERRORLEVEL% equ 0 goto execute
 
 echo.
 echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
@@ -75,13 +76,15 @@ set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
 
 :end
 @rem End local scope for the variables with windows NT shell
-if "%ERRORLEVEL%"=="0" goto mainEnd
+if %ERRORLEVEL% equ 0 goto mainEnd
 
 :fail
 rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
 rem the _cmd.exe /c_ return code!
-if  not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
-exit /b 1
+set EXIT_CODE=%ERRORLEVEL%
+if %EXIT_CODE% equ 0 set EXIT_CODE=1
+if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
+exit /b %EXIT_CODE%
 
 :mainEnd
 if "%OS%"=="Windows_NT" endlocal

package/template/android/settings.gradle

@@ -1,4 +1,4 @@
 rootProject.name = 'template'
 apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
 include ':app'
-includeBuild('../node_modules/react-native-gradle-plugin')
+includeBuild('../node_modules/@react-native/gradle-plugin')

package/template/app.json

@@ -1,4 +1,4 @@
 {
   "name": "template",
   "displayName": "template"
-}
+}

package/template/babel.config.js

@@ -1,29 +1,20 @@
 module.exports = {
   presets: ['module:metro-react-native-babel-preset'],
-  plugins: [
+  plugins:[
     [
       'module-resolver',
       {
         root: ['./src'],
         extensions: ['.ios.js', '.android.js', '.js', '.ts', '.tsx', '.json'],
         alias: {
-          "*": "./src",
-          "@components": "./src/components",
-          "@assets": "./src/assets",
-          "@pages": "./src/pages",
-          "@route": "./src/route",
-          "@utils": "./src/utils",
-          "@types": "./src/types",
-          "@config": "./src/config",
-          "@iconfont": "./src/iconfont"
-        }
-      }
+          '@': ['./src'],
+        },
+      },
     ],
-    ["@babel/plugin-proposal-decorators", { "legacy": true }]
   ],
-  env:{
-    production:{
-      plugins:['transform-remove-console']
-    }
-  }
+  env: {
+    production: {
+      plugins: ['transform-remove-console'],
+    },
+  },
 };

package/template/global.d.ts

@@ -0,0 +1,3 @@
+declare module '*.jpg';
+declare module '*.jpeg';
+declare module '*.png';

package/template/index.js

@@ -2,9 +2,8 @@
  * @format
  */
 
-import { AppRegistry } from 'react-native';
+import {AppRegistry} from 'react-native';
 import App from './App';
-import { name as appName } from './app.json';
-import './resetDefault';
+import {name as appName} from './app.json';
 
 AppRegistry.registerComponent(appName, () => App);