Learn about uapp

uapp is a command-line tool that solves the pain points of uniapp development and improves its development efficiency. Similar to the role of cordova, ionic, expo. uapp also contains template codes for uapp-android and uapp-ios platforms.

During the development process, many cumbersome operations useuappIt’s all done in one step:

• To start a new project, it is usually necessary to modify many parameters in the project, such as the name of the app, version number, dcloud_key, WeChat-related appkey, etc. Manual work is not only cumbersome, but also error-prone. Using uapp manifest sync Get it done in one step.
• The configurations of APP release and development and debugging are not exactly the same. For example, if you cannot release a debugging-related library such as debug-server-release.aar, you need to separate the release and development configurations. uapp has already done the isolation for you Configuration, and it is very convenient to realize the automatic integration of the release process through jenkins, even if it is not needed, it is better than manually changing it, making yourself dizzy.
• To compile a debugging base by yourself, do you need to manually COPY to HBuilderX?use uapp publish debug Automatic compilation is done in one step.
• The local APP resources compiled by HBuilderX still need to be manually copied to the project? Use uapp prepare Get it done in one step.
• How to check the signature information required by WeChat Developer Platform and DCloud Developer Center,uapp info Get it done in one step.
• What is the command of uniapp-cli to create a new project? I don’t remember it.uapp new xxx Get it done in one step.

uniapp runs on multiple platforms with one set of code

uniapp is a multi-platform front-end framework based on Vue isomorphic technology. For companies or entrepreneurs, only one front-end that knows Vue can write App (android/ios), H5, quick app, WeChat/QQ at the same time /Douyin/Feishu/Baidu/Alipay and other small programs, maintaining a set of codes can be published on more than 10 platforms. There are several advantages:

• Publish on multiple platforms to get more traffic
• Once familiar, the development efficiency is extremely high
• Save at least 1/3 of research and development costs, lower commercial trial and error costs
• Even if you don’t need to release multiple platforms at present, you still spend time writing code, why not choose a method with higher reuse value?

However, there is only DEMO in the official offline package released by uniapp. For a new project, there are many configurations that need to be changed manually, and the debugging base and the official release share the same configuration, which is very inconvenient to maintain. uapp is some of the experience we have accumulated after practicing some products. It separates the configuration of debugging and release, and it is also convenient to add automation integration through commands.

Why not use online packaging instead?

uniapp online packaging generally cannot meet flexible requirements, such as:

• Unable to implement automated integrations (automated builds, unit tests, releases) within the team.
• Some packages are redundant, and online packaging cannot control which packages are entered.
• There is a size limit for online packaging, and you need to pay separately if you exceed it, because it takes up official server resources.
• When writing uniapp plug-in extensions, you must have an offline project to facilitate debugging, and you can control whether to publish the plug-in by yourself. We also encountered some inconvenience when writing ffmpeg extensions.

Install uappsdk first

1. Install the uapp command

npm install -g uapp

# 初始化或更新 uappsdk
uapp sdk init

2. Download the uniapp offline packaged SDK

Note that it is different from .uappsdk, the SDK of the uniapp offline package here refers to the official release of dcloud

android offline packaging SDK:

https://nativesupport.dcloud.net.cn/AppDocs/download/android

ios offline packaging SDK:

https://nativesupport.dcloud.net.cn/AppDocs/download/ios

Unzip the SDK directory and put it into the .uappsdk folder. The final .uappsdk folder structure is as follows:

> $HOME/.uappsdk/
.
├── android
│   ├── SDK # -> 这里是Android的SDK
│   └── libs
├── ios
│   ├── SDK # -> 这里是iOS的SDK
└── templates
    └── manifest.json

SDK related files are placed in the $HOME/.uappsdk directory of the current user.

Please be sure to read the official SDK module dependency instructions carefully for which templates need to be imported. If there are too many templates, it will affect the APP review, and if there are too few templates, it will affect the function usage.

The third-party dependent packages included in the .uappsdk directory by default only include WeChat authorized login, Apple authorized login, basic functions, etc. It does not include related dependencies such as advertisements and notifications, because the SDKs for advertisements and notifications need to submit data tracking instructions during review, which is troublesome.

If it is not necessary, it is best not to include it. If you really need it, you can manually add it yourself, refer to the following module dependency instructions.

Android module dependency description:

For android, you only need to extract the necessary dependent packages and put them in $HOME/.uappsdk/android/libs. https://nativesupport.dcloud.net.cn/AppDocs/usemodule/androidModuleConfig/android_Library

ios module dependency description:

https://nativesupport.dcloud.net.cn/AppDocs/usemodule/iOSModuleConfig/common

Download offline packaging project source code

1. Download Android offline project source code

See doc/uapp-android.md

2. Download iOS offline project source code

See doc/uapp-ios.md

The engineering of iOS has always been inconvenient, and CocoaPods is usually used, but it is not suitable for the release form of DCloud offline SDK. After our continuous practice in the product, we finally chose XCodeGen.

3. Common commands under the project

# 读取 manifest 中的配置，并更新基本信息
uapp manifest info
uapp manifest sync ${webapp}/src/manifest.json

# 更新 HBuilderX 本地打包资源
# 如果通过 HBuilderX 重新编译，或者通过 uniapp-cli 命令重新编译的资源，可以通过 prepare 命令更新到离线 APP 工程中，用于 APP 重新打包发布。
uapp prepare

# 编译并发布自定义基座到 HBuilderX 下
uapp publish debug

manifest.json related configuration

Notice: uapp.* 参数 It is extended by uapp according to the needs, not the official standard of dcloud.

in the original project manifest.json Most of the parameters inside are used for hbuiderx online cloud packaging. In the ultimate release package generated after compilation, irrelevant data has been removed from the manifest.json inside, so there is no need to worry about parameter exposure.

{
  "name": "uapp",
  "appid": "__UNI__ECA8F4D",
  "versionName": "1.0.1",
  "versionCode": "1000000",
  "uapp": {
    "name": "μAppKit",
    "package": "com.code0xff.uapp",
    "android.appkey": "b4ab7d1c668cbb3b257aeeabd75c29da",
    "ios.appkey": "aa215ff1522abe39cb7ccec5943eeb92",
    "prepare.dir": "${SRC}/../dist/build/app",
    "prepare.before": "cd ${SRC}/../ && npm run build:app",
    "prepare.after": "uapp publish debug"
  },
  "app-plus": {
    "distribute": {
      "sdkConfigs": {
        "oauth": {
          "weixin": {
            "appid": "wx95039516c9f72e50",
            "appsecret": "123456",
            "UniversalLinks": "https://uapp.code0xff.com/"
          }
        }
      }
    }
  }
}

🔥 uapp.* parameter description

👉 Different platforms can be distinguished by prefixes

name, package, versionName, versionCode If you need platform differentiation definition, you can add the prefix android.xxx, ios.xxx

For example android.name, android.package, ios.package, ios.versionCode…

prepare.* parameters, you can use ${SRC}, ${SRC} It is the same-level directory of the current manifest.json. It supports adding ../ to locate the upper-level directory and avoid using absolute paths.

👇👇👇

How to apply for dcloud_appkey

https://nativesupport.dcloud.net.cn/AppDocs/usesdk/appkey

How to apply for WeChat appid

Log in to the WeChat developer platform to create an APP, after review, get weixin.appid, weixin.appsecret and other parameters, used for WeChat login, sharing, payment and other related parameters

https://open.weixin.qq.com/

Notes on cross-end development

https://uniapp.dcloud.io/matter.html

iOS Apple Authorized Login

1. Get the team_id, client_id, key_id and fill them in jwt/config.json, as follows:

{
    "team_id": "3DSM494K6L",
    "client_id": "com.code0xff.uapp.login",
    "key_id": "3C7FMSZC8Z"
}

2. Log in to the Apple developer account, create and download the signature file, and rename it to jwt/key.txt.

3. Run uapp info Command to view JWT Token

👉 Reference tutorial: http://help.jwt.code0xff.com

uapp help

See doc/help.txt

License

The Apache License 2. Please see License File for more information.