美文网首页
uniapp中自定义条件编译平台总结

uniapp中自定义条件编译平台总结

作者: 周星星的学习笔记 | 来源:发表于2022-02-04 10:13 被阅读0次

    有的时候,我们需要将开发的应用发布到不同的平台,例如同样是发布到H5平台,可能还会再分线上平台、开发平台等等,对于不同的平台可能会涉及到接口域名、秘钥配置等等的差异性,但是如果每次编译到不同的平台都要进行手动修改相应的地方就太麻烦了,uniapp给我们提供了一种自定义条件编译平台的方式,方便我们运行、编译到我们自定义的平台。下面用一个例子来说明一下。

    一、在package.json中增加uni-app扩展节点

    {
        /**
         package.json其它原有配置 
         */
        "uni-app": {// 扩展配置
            "scripts": {
                "custom-platform": { //自定义编译平台配置,可通过cli方式调用
                    "title":"自定义扩展名称", // 在HBuilderX中会显示在 运行/发行 菜单中
                    "browser":"",  //运行到的目标浏览器,仅当UNI_PLATFORM为h5时有效
                    "env": {//环境变量
                        "UNI_PLATFORM": "h5",  //基准平台
                        "VUE_APP_TEST_NAME": "", // ... 其他自定义环境变量,需要以VUE_APP_开头
                     },
                    "define": { //自定义条件编译
                        "CUSTOM-CONST": true //自定义条件编译常量,建议为大写
                    }
                }
            }    
        }
    }
    
    • UNI_PLATFORM仅支持填写uni-app默认支持的基准平台,目前仅限如下枚举值:h5、mp-weixin、mp-alipay、mp-baidu、mp-toutiao、mp-qq
    • browser 仅在UNI_PLATFORM为h5时有效,目前仅限如下枚举值:chrome、firefox、id、edge、safari、hbuilderx
    • package.json文件中不允许出现注释,否则扩展配置无效

    二、定义好之后HBuilderX的菜单变化

    1.运行

    运行

    2.发布

    发布

    三、代码中使用自定义的平台(跟其他内置平台编译方式一致)

    #例如:在JS中的使用
    // #ifdef CUSTOM-CONST
    自定义平台特有代码
    // #endif
    

    四、参考文章

    1.uniapp自定义条件编译平台
    2.uniapp条件编译

    相关文章

      网友评论

          本文标题:uniapp中自定义条件编译平台总结

          本文链接:https://www.haomeiwen.com/subject/grvjkrtx.html