Taro打包Android apk

首先,咱們使用使用命令建立模板項目,建立的命令以下。javascript

taro init myApp

而後,使用 yarn 或者 npm install安裝依賴包,並使用下面的命令編譯Taro項目。java

yarn dev:rn

啓動後會開啓一個監聽的進程,以下圖。
在這裏插入圖片描述node

不過,細心的你可能會發現,使用taro init命令初始化的項目是沒有原生模塊支持的,原來Taro使用了一個殼子工程,首先使用下面的命令下載殼子工程taro-native-shell,以下所示。react

git clone git@github.com:NervJS/taro-native-shell.git

在taro-native-shell個目錄使用 yarn 或者 npm install 安裝依賴,並使用下面的命令啓動殼子工程。android

react-native run-android

不過,啓動後報了以下的錯誤:git

error: bundling failed: NotFoundError: Cannot find entry file index.js in any of the roots: ["/Users/mac/Taro/work/taro-yanxuan"]
    at DependencyGraph.getAbsolutePath (/Users/mac/Taro/work/taro-yanxuan/node_modules/metro/src/node-haste/DependencyGraph.js:317:11)
    at /Users/mac/Taro/work/taro-yanxuan/node_modules/metro/src/DeltaBundler/DeltaCalculator.js:280:416
    at Generator.next (<anonymous>)
    at step (/Users/mac/Taro/work/taro-yanxuan/node_modules/metro/src/DeltaBundler/DeltaCalculator.js:11:445)
    at /Users/mac/Taro/work/taro-yanxuan/node_modules/metro/src/DeltaBundler/DeltaCalculator.js:11:605
    at processTicksAndRejections (internal/process/task_queues.js:97:5)

在網上找了下,找到以下一篇帖子:taro-native-shell 殼子,android studio 啓動報錯
上面報錯的意思是找不到RN的入口文件index.js。對於這個問題,只須要將 MainApplication.java 裏面的 getJSMainModuleName 修改改成:rn_temp/index便可,由於Taro打的包在rn_temp目錄下,最新的 react-native-shell 已修復。github

修改後,從新執行react-native run-android命令。不過,因爲項目是0.60.0版本如下的,因此我在運行的時候又報了下面的錯誤。shell

React Native version mismatch

javascript version 0.55.4
Native version 0.64.0

這是由於react-native-shell 是0.64.0,而個人RN項目是0.55.4,因此只能升級RN項目或者降級
react-native-shell 。若是沒有任何錯誤,接下來就能夠製做離線的apk包了。
首先,你須要生成Android的密鑰文件,關於如何生成密鑰文件,能夠自行查找相關的資料,把生成的密鑰文件拷貝到工程中的android/app文件夾中。而後,在在/android/gradle.properties中添加以下常量代碼。npm

MYAPP_RELEASE_STORE_FILE=my-release-key.keystore
MYAPP_RELEASE_KEY_ALIAS=my-key-alias
MYAPP_RELEASE_STORE_PASSWORD=*****
MYAPP_RELEASE_KEY_PASSWORD=*****

而後,在app/build.gradle文件中添加以下代碼。react-native

release {
            if (project.hasProperty('MYAPP_UPLOAD_STORE_FILE')) {
                storeFile file(MYAPP_UPLOAD_STORE_FILE)
                storePassword MYAPP_UPLOAD_STORE_PASSWORD
                keyAlias MYAPP_UPLOAD_KEY_ALIAS
                keyPassword MYAPP_UPLOAD_KEY_PASSWORD
            }
        }

接下來,把前面生成的rn_temp文件複製到taro-native-shell殼子工程的android文件夾下,修改MainApplication裏面的代碼,以下所示。

@Override
    protected String getBundleAssetName()  {
      return "./android/rn_temp/index";
    }
  };

而後,在android/app/build.gradle中修改添加以下代碼。

project.ext.react = [
        entryFile: "android/rn_temp/index.js",
        cliPath:"node_modules/react-native/cli.js"
]

而後,執行以下命令執行生成index.bundle 文件,以下所示。

node ./node_modules/react-native/local-cli/cli.js bundle --entry-file ./android/rn_temp/index.js --bundle-output ./android/rn_temp/index.bundle --assets-dest ./rn_bundle --dev false

最後,在Android的根目錄下執行打包命令。

./gradlew assembleRelease

打包完成後,就能夠在android/app/build/outputs中看到簽名包。

相關文章
相關標籤/搜索