uni-app在不同平台 样式不同以及方法等 条件编译

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

根据不同的平台改变不同的样式

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

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

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

上面的“或” 要用符号 || 代替

%PLATFORM% 可取值如下：

值	平台
APP-PLUS	App
APP-PLUS-NVUE或APP-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	快应用华为

支持的文件

.vue
.js
.css
pages.json
各预编译语言文件，如：.scss、.less、.stylus、.ts、.pug
注意：

条件编译是利用注释实现的，在不同语法里注释写法不一样
，js使用 // 注释、css 使用 /* 注释 */、
vue/nvue 模板里使用 <!-- 注释 -->；
条件编译APP-PLUS包含APP-NVUE和APP-VUE，APP-PLUS-NVUE和APP-NVUE没什么区别，
为了简写后面出了APP-NVUE ；

API 的条件编译

// #ifdef %PLATFORM%
平台特有的API实现
// #endif

组件条件编译

<!--  #ifdef  %PLATFORM% -->
平台特有的组件
<!--  #endif -->

<view>
    <view>微信公众号关注组件</view>
    <view>
        <!-- uni-app未封装，但可直接使用微信原生的official-account组件-->
        <!-- #ifdef MP-WEIXIN -->
                <official-account></official-account>
            <!-- #endif -->
    </view>
</view>

样式的条件编译

/*  #ifdef  %PLATFORM%  */
平台特有样式
/*  #endif  */

/* #ifdef H5 */
        uni-page-head { display: none; }
    /* #endif */