uniapp文档常用整理

1.环境判断

uni-app 可通过 process.env.NODE_ENV 判断当前环境是开发环境还是生产环境。一般用于连接测试服务器或生产服务器的动态切换。

if(process.env.NODE_ENV === 'development'){
   
    console.log('开发环境')
}else{
   
    console.log('生产环境')
}

2.判断平台

• 编译期判断 编译期判断，即条件编译，不同平台在编译出包后已经是不同的代码

// #ifdef H5
    alert("只有h5平台才有alert方法")
// #endif

• 运行期判断 运行期判断是指代码已经打入包中，仍然需要在运行期判断平台，此时可使用 uni.getSystemInfoSync().platform 判断客户端环境是 Android、iOS 还是小程序开发工具（在百度小程序开发工具、微信小程序开发工具、支付宝小程序开发工具中使用 uni.getSystemInfoSync().platform 返回值均为 devtools）。

switch(uni.getSystemInfoSync().platform){
   
    case 'android':
       console.log('运行Android上')
       break;
    case 'ios':
       console.log('运行iOS上')
       break;
    default:
       console.log('运行在开发者工具上')
       break;
}

3.样式导入

使用@import语句可以导入外联样式表，@import后跟需要导入的外联样式表的相对路径

<style>
    @import "../../common/uni.css";

    .uni-card {
   
        box-shadow: none;
    }
</style>

4.固定值

uni-app 中以下组件的高度是固定的，不可修改：

组件	描述	App	H5
NavigationBar	导航栏	44px	44px
NavigationBar	底部选项卡	HBuilderX 2.3.4之前为56px，2.3.4起和H5调为一致，统一为 50px。但可以自主更改高度）	50px

各小程序平台，包括同小程序平台的iOS和Android的高度也不一样。

5.背景图片

• 小程序不支持在css中使用本地文件，包括本地的背景图和字体文件。需以base64方式方可使用。App端在v3模式以前，也有相同限制。v3编译模式起支持直接使用本地背景图和字体。
• 使用本地路径背景图片需注意:在背景图片小于 40kb 时，uni-app 编译到不支持本地背景图的平台时，会自动将其转化为 base64 格式；图片大于等于 40kb，会有性能问题，不建议使用太大的背景图,本地背景图片的引用路径推荐使用以 ~@ 开头的绝对路径。

 .test2 {
   
     background-image: url('~@/static/logo.png');
 }

• 微信小程序不支持相对路径（真机不支持，开发工具支持）

6. App SdkConfigs汇总

三方原生SDK配置。三方SDK的使用需要向这些SDK提供商申请，并配置参数到此处。可在HBuilderX可视化界面（App SDK配置）输入配置，此配置仅云打包后生效，本地打包需自行在原生工程中配置。

属性	类型	描述
oauth	Object	授权登录，配置后可调用 uni.login 进行登录操作，目前支持的授权登录平台有：QQ、微信、新浪微博。
share	Object	分享，配置后可调用uni.share进行分享，目前支持
push	Object	目前支持uniPush、个推、小米推送，注意app仅支持push方式，配置多个push无效，建议使用uniPush,支持多厂商推送。
payment	Object	三方支付配置，配置后可调用 uni.payment 进行支付，目前支持微信支付、支付宝支付、苹果内购
statics	Object	统计配置，目前仅支付友盟统计，详见，在uni-app中只用 plus.statistic 进行调用。
maps	Object	原生地图配置，目前仅支持 高德地图，申请方式可参考：地图插件配置。

7.完整 manifest.json

{
   
    "appid": "__UNI__XXXXXX，创建应用时云端分配的，不要修改。",
    "name": "应用名称，如uni-app",
    "description": "应用描述",
    "versionName": "1.0.0",
    "versionCode": "100",
  // 是否全局关闭uni统计
  "uniStatistics": {
     
      "enable": false//全局关闭  
  },
    // app-plus 节点是 App 特有配置，推荐在 HBuilderX 的 manifest.json 可视化界面操作完成配置。
    "app-plus": {
   
        // HBuilderX->manifest.json->模块权限配置
    "optimization": {
   
      "subPackages": true // HBuilderX 2.7.12+ 支持
    },
    // 屏幕方向
    "screenOrientation": [
      "portrait-primary",
      "landscape-primary",
      "portrait-secondary",
      "landscape-secondary"
    ],
        "modules": {
   
            "Contacts": {
   },
            "Fingerprint": {
   },
            "Maps": {
   },
            "Messaging": {
   },
            "OAuth": {
   },
            "Payment": {
   },
            "Push": {
   },
            "Share": {
   }