1. 由于UNIAPP 是一套代码多个平台都可以使用，所以就有些兼容问题要处理。有些代码小程序是没有问题，但是到了H5或者是APP 就无法使用的问题。

2.这些问题呢，UNIAPP有一个API 的条件编译可以解决，就跟VUE的if else一样简单方便，可以解决大部分的兼容问题，接下来就给大家详细的列举一下 并告诉怎么使用。

3.使用方法和类型

3.1下面的样式是在js中使用

// #ifdef APP-PLUS
	此代码只在APP中出现
// #endif

// #ifdef H5
	此代码只在H5中出现
// #endif

// #ifdef H5 || APP-PLUS
	此代码只在H5和APP中出现
// #endif

// #ifdef MP-WEIXIN
	此代码只在小程序中出现
// #endif

3.2下面样式是在html中使用

<!--  #ifdef   MP-WEIXIN -->
	在小程序中出现，
<!--  #endif -->

<!--  #ifdef   H5 || APP-PLUS -->
	在APP和H5中出现，
<!--  #endif -->

<!--  #ifdef  APP-PLUS -->
	在APP中出现，
<!--  #endif -->

<!--  #ifdef  H5 -->
	在H5中出现，
<!--  #endif -->

示例：

<view>
    <view>微信公众号关注组件</view>
    <view>
        <!-- 下面的代码只在小程序中出现-->
        <!-- #ifdef MP-WEIXIN -->
                <view>我是小程序的代码</view>
            <!-- #endif -->
            <view>我是除了小程序不显示，其他都能显示的代码</view>
    </view>
</view>

3.3 在css样式中使用

提示：样式的条件编译，无论是 css 还是 sass/scss/less/stylus 等预编译语言中，必须使用 / * 注释 * / 的写法。

使用方法基本和上面相同 只是把前面的注释方法改一下就行。比如：

/*  #ifdef MP-WEIXIN  */
	.wx-color {
		color:#FFFFFF;
	}
/*  #endif  */
	.wx-color {
		color:#cccccc;
	}

错误的写法：

// #ifdef MP-WEIXIN 
	.wx-color {
		color:#FFFFFF;
	}
// #endif  */
	.wx-color {
		color:#cccccc;
	}

3.4 pages.json 的条件编译

1.这个我就不详细说了 跟上面都差不多 就找了一张图 给你们看看，如图：

注意前面的注释写法。千万不要写错了。

学前端，关注老张。带你们了解更多bug的解决方法