uniapp条件编译

1.说明

条件编译是用特殊的注释作为标记，在编译时根据这些特殊的注释，将注释里面的代码编译到不同平台。

配置不同端协议的时候经常用到。

写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 开头，以 #endif 结尾。

1  #ifdef：if defined 仅在某平台存在
2  #ifndef：if not defined 除了某平台均存在
3  %PLATFORM%：平台名称

写法	说明
#ifdef APP-PLUS 需条件编译的代码   #endif	仅出现在 App 平台下的代码
#ifndef H5  需条件编译的代码        #endif	除了 H5 平台，其它平台均存在的代码
#ifdef H5 || MP-WEIXIN               需条件编译的代码      #endif	在 H5 平台或微信小程序平台存在的代码 （这里只有||，不可能出现&&，因为没有交集）

2.常用值

值	平台
APP-PLUS	APP
APP-PLUS-NVUE	APP nvue
H5	H5
MP-WEIXIN	微信小程序
MP-ALIPAY	支付宝小程序
MP-BAIDU	百度小程序
MP-TOUTIAO	字节跳动小程序
MP-QQ	QQ小程序
MP-360	360小程序
MP	微信小程序/支付宝小程序/百度小程序/字节跳动小程序 /QQ小程序/360小程序
quickapp-webview	快应用通用（联盟、华为）
quickapp-webview-union	快应用联盟
quickapp-webview-huawei	快应用华为

3.举例

1）CSS里面判断不同的端

APP：APP端
 
            /*#ifdef APP-PLUS*/
            top:0;
            /*#endif*/
 
H5：H5端
            /*#ifdef H5*/
            top:88rpx;
            /*#endif*/
 
MP：小程序
            /*#ifdef MP*/
            top:0;
            /*#endif*/

2）JS里面判断不同的端

APP：APP端
 
            /*#ifdef APP-PLUS*/
            console.log('APP端')
            /*#endif*/
 
H5：H5端
            /*#ifdef H5*/
            console.log('H5端')
            /*#endif*/
 
MP：小程序
            /*#ifdef MP*/
            console.log('微信小程序端')
            /*#endif*/

3）在页面上判断不同的端

APP：APP端
 
            <!-- #ifdef APP-PLUS -->
            <view> APP端 </view>
            <!-- #endif -->
 
H5：H5端
            <!-- #ifdef H5 -->
            <view> H5端 </view>
            <!-- #endif -->
 
MP：小程序
           <!-- #ifdef MP -->
            <view> 小程序端 </view>
            <!-- #endif -->