參考C語言的，詳細(xì)如下：

?

• 大量寫 if else，會(huì)造成代碼執(zhí)行性能低下和管理混亂。
• 編譯到不同的工程后二次修改，會(huì)讓后續(xù)升級(jí)變的很麻煩。

在 C 語言中，通過 #ifdef、#ifndef 的方式，為 windows、mac 等不同 os 編譯不同的代碼。?uni-app?參考這個(gè)思路，為?uni-app?提供了條件編譯手段，在一個(gè)工程里優(yōu)雅的完成了平臺(tái)個(gè)性化實(shí)現(xiàn)。

條件編譯是用特殊的注釋作為標(biāo)記，在編譯時(shí)根據(jù)這些特殊的注釋，將注釋里面的代碼編譯到不同平臺(tái)。

寫法：以?#ifdef?或?#ifndef?加?%PLATFORM%?開頭，以?#endif?結(jié)尾。

• #ifdef：if defined 僅在某平臺(tái)存在
• #ifndef：if not defined 除了某平臺(tái)均存在
• %PLATFORM%：平臺(tái)名稱

例子：

?

?

%PLATFORM%?可取值如下：

支持的文件

• .vue
• .js
• .css
  • • pages.json　　　　這個(gè)用的比較少
• 各預(yù)編譯語言文件，如：.scss、.less、.stylus、.ts、.pug

注意：

• 條件編譯是利用注釋實(shí)現(xiàn)的，在不同語法里注釋寫法不一樣，js使用?// 注釋、css 使用?/* 注釋 */、vue/nvue 模板里使用?<!-- 注釋 -->；
• 條件編譯APP-PLUS包含APP-NVUE和APP-VUE，APP-PLUS-NVUE和APP-NVUE沒什么區(qū)別，為了簡(jiǎn)寫后面出了APP-NVUE ；
• 使用條件編譯請(qǐng)保證編譯前和編譯后文件的正確性，比如json文件中不能有多余的逗號(hào)；
• VUE3?需要在項(xiàng)目的?manifest.json?文件根節(jié)點(diǎn)配置?"vueVersion" : "3"

?

上面說那么多 現(xiàn)在開始實(shí)戰(zhàn)，我們分別以?vue? 、js 、 css? 來寫：

?

<template>
    <view>
        
        <!-- #ifdef H5 -->
        <view>這行文字 只有在H5的環(huán)境下才能被看到！</view>
        <!--#endif-->
        
        <!-- #ifdef MP -->
        <view>這行文字 只有在小程序(微信小程序/支付寶小程序/百度小程序/字節(jié)跳動(dòng)小程序/QQ小程序/360小程序)的環(huán)境下才能被看到！</view>
        <!--#endif-->
        
        <!-- #ifdef APP-PLUS -->
        <view>這行文字 只有在IOS / 安卓的環(huán)境下才能被看到！</view>
        <!--#endif-->
        
        <!-- #ifndef MP  -->
        <view>這行文字 只有在IOS / 安卓 / H5 的環(huán)境下才能被看到！ 小程序不可能被看到！</view>
        <!--#endif-->
        
    </view>
</template>

<script>
    export default {
        data() {
            return {
                
            }
        },
        methods: {
            
        },
        onLoad() {
            //#ifdef MP-WEIXIN
            console.log("只有微信小程序才能看到我輸出這行");
            //#endif
            //#ifdef H5
            console.log("只有H5才能看到我輸出這行");
            //#endif
        }
    }
</script>

<style>

</style>

flagCompile.vue

C3哪里沒實(shí)踐，按照這 /**/ 照貓畫虎即可? 很簡(jiǎn)單??！

?