The Taro Playground App is a cross-platform application developed using Taro, to help developers develop and debug Taro applications. It is initialized using taro react native template.

Android	iOS	Web	Mini Program
https://github.com/wuba/taro-playground/releases	https://apps.apple.com/cn/app/taro-playground/id1576830673	https://wuba.github.io/taro-playground/	https://github.com/wuba/taro-playground

https://testflight.apple.com/join/RDFCp2yy

0. taro: @tarojs/cli@^3.2.0
1. framework: 'react'

install peerDependencies of @tarojs/taro-rn @tarojs/components-rn and @tarojs/router-rn, it will also run post-install. please modify and run upgradePeerdeps script when you change taro version.

run this script after the project is initialized.

yarn upgradePeerdeps

run this script when you add new react native library or update react native library version.

see pod-install for more information.

yarn podInstall

yarn ios

yarn android

yarn start

yarn start --reset-cache

0. development process of taro react native
1. github address of the taro project
2. related articles of taro playground

yarn build:rn --platform ios

yarn build:rn --platform android

see publishing-to-app-store for details.

see signed-apk-android for details.

use github actions to build your apps. this template include basic github action config.

see .github/workflows for details.

we assemble debug and release product for both android and ios when you push or pull request on master branch by default. design your own pipeline by modify .github/workflows files.

see events-that-trigger-workflows

Modify the following configuration items for package and publish your app.

.github/workflows/assemble_ios_debug.yml .github/workflows/assemble_ios_release.yml

env:
  APP_ID: com.taro.demo # Application Product Bundle Identifier
  APP_NAME: Taro Demo # The Display Name of your app
  VERSION_NUMBER: 1.0.0 # Application version number
  BUILD_NUMBER: 1.0.0.0 # Application build number, used by release only.
  TEAM_ID: XXXXXXXXXX # Team ID, is used when upgrading project
  PROVISIONING_PROFILE_SPECIFIER: Product_profile # Provisioning profile name to use for code signing
  CODE_SIGN_IDENTITY: iPhone Distribution # Code signing identity type (iPhone Developer, iPhone Distribution)
  SIGNING_CERTIFICATE_P12_DATA: ${{secrets.RELEASE_SIGNING_CERTIFICATE_P12_DATA}}
  SIGNING_CERTIFICATE_PASSWORD: ${{secrets.RELEASE_SIGNING_CERTIFICATE_PASSWORD}}
  PROVISIONING_PROFILE_DATA: ${{secrets.RELEASE_PROVISIONING_PROFILE_DATA}}
  APP_STORE_CONNECT_USERNAME: ${{secrets.APP_STORE_CONNECT_USERNAME}} # This secret should be set to the Apple ID of your developer account, used by release only.
  APP_STORE_CONNECT_PASSWORD: ${{secrets.APP_STORE_CONNECT_PASSWORD}} # used by release only.

values like ${{secrets.xxxxx}} are manually generated and store in your github encrypted secrets.

cat Certificates.p12 | base64 | pbcopy

encryption password of your Personal Information Exchange (.p12)

cat profile.mobileprovision | base64 | pbcopy

This secret should be set to an application-specific password for your Apple ID account. Follow these instructions to create an application-specific password.

1. deploy an ios app to testflight or the app store using github actions
2. encrypted-secrets
3. fastlane

Modify the following configuration items for package and publish your app.

.github/workflows/assemble_android_debug.yml .github/workflows/assemble_android_release.yml

env:
  APP_ID: com.taro.demo  # Application Product Bundle Identifier
  APP_NAME: Taro Demo  # The Display Name of your app
  VERSION_NAME: 1.0.0 # version name
  VERSION_CODE: 10 # version code
  KEYSTORE_FILE: debug.keystore # key store file
  KEYSTORE_PASSWORD: android # key store password
  KEYSTORE_KEY_ALIAS: androiddebugkey # key store key alias
  KEYSTORE_KEY_PASSWORD: android # key store key password

For the security of your app, please regenerate the .keystore file and store the password in your github encrypted secrets.

1. app signing
2. encrypted-secrets

This project supports web and mini program, but it has not been fully tested.

yarn dev:h5

see peaceiris/actions-gh-pages for more details.

yarn dev:weapp

We use @tarojs/plugin-mini-ci to deploy mini programs. Modify the following configuration items for package and publish your wechat mini program.

.github/workflows/assemble_weapp_release.yml

env:
  WEAPP_ID: ${{ secrets.WEAPP_ID }} # wechat mini program id
  WEAPP_KEY: ${{ secrets.WEAPP_KEY }} # wechat mini program key

values like ${{secrets.xxxxx}} are manually generated and store in your github encrypted secrets.

cat private.$WEAPP_ID.key | base64 | pbcopy

The source code is customized for the Taro playground application and is for reference only. If you want to use it directly, please make the following changes.

0. Use your own signature file.
1. Customize your app id, app name, app launcher, etc.
2. Remove the attention block in ios/Podfile.

0. Change appName to taroDemo, which used in AppRegistry.registerComponent(appName, () => App);.
1. Generate a QR code with content taro://${ip}:${port} or shaking the phone and change bundle Location.

We sincerely hope that developers can provide valuable comments and suggestions, and developers can provide feedback on suggestions and problems by submitting PR or Issue.

If you have other questions, you can join the communication group for help.

Taro Playground source code is available under the Apache License V2.

Taro and its graphic trademarks are owned by Beijing Jingdong Century Trading Co., Ltd. and licensed to the Taro Playground project.