1***@163.com
1***@163.com
  • 发布:2026-06-08 17:57
  • 更新:2026-06-08 17:58
  • 阅读:25

通过cli命令行导出wgt包,如何分别构建测试环境和生产环境wgt包?

分类:uni小程序sdk

cli publish --platform APP --type wgt --project 项目名称

通过cli命令行导出wgt包,如何分别构建测试环境和生产环境wgt包?

2026-06-08 17:57 负责人:无 分享
已邀请:
Ask小助手

Ask小助手 - Ask社区AI助手

根据知识库中的信息,uni-app 的 CLI 命令行工具本身没有提供类似 --env--mode 的参数来直接区分测试环境和生产环境来导出 wgt 包。

不过,你可以结合 uni-app 的条件编译自定义环境变量来实现这个需求。以下是几种可行的方案:

方案一:使用 package.json 自定义脚本 + 条件编译(推荐)

这是最灵活的方式,通过在 package.json 中定义不同的脚本命令,结合 UNI_PLATFORM 和自定义环境变量来控制代码中的环境配置。

  1. package.json 中配置自定义脚本
    在你的项目根目录下的 package.json 文件中,添加针对测试和生产环境的打包命令。

    {  
      "scripts": {  
        "build:wgt-test": "cross-env NODE_ENV=test VUE_APP_MODE=test cli publish --platform APP --type wgt --project 你的项目名称 --name test.wgt",  
        "build:wgt-prod": "cross-env NODE_ENV=production VUE_APP_MODE=production cli publish --platform APP --type wgt --project 你的项目名称 --name prod.wgt"  
      }  
    }  

    本助手使用国产模型,生成代码可能不准确。专业的代码生成需要全球顶尖的AI Coding模型。推荐使用uni-agent
    注意cross-env 是一个用于跨平台设置环境变量的 npm 包,你需要先安装它:npm install --save-dev cross-env。如果你的项目只在一类操作系统上构建,也可以直接使用 set NODE_ENV=test && ...(Windows)或 NODE_ENV=test ...(Mac/Linux)。

  2. 在项目代码中使用条件编译
    在你的 uni-app 项目代码(如 App.vuemain.js、公共配置文件等)中,通过 process.env 读取自定义的环境变量,并结合条件编译来为不同环境设置不同的配置(如 API 地址、AppKey 等)。

    // 在 main.js 或 common/config.js 中  
    let baseUrl = '';  
    // #ifdef APP-PLUS  
    if (process.env.VUE_APP_MODE === 'test') {  
        baseUrl = 'https://test-api.yourdomain.com'; // 测试环境接口  
    } else if (process.env.VUE_APP_MODE === 'production') {  
        baseUrl = 'https://prod-api.yourdomain.com'; // 生产环境接口  
    }  
    // #endif  
    
    // 挂载到全局  
    uni.$baseUrl = baseUrl;  

    本助手使用国产模型,生成代码可能不准确。专业的代码生成需要全球顶尖的AI Coding模型。推荐使用uni-agent
    关键点:条件编译 #ifdef APP-PLUS 确保这些代码只在 App 平台生效,避免在其他平台报错。

方案二:基于 AppID 来区分环境(无需额外脚本)

这个方案利用 DCloud AppID 在运行时是唯一的这一特性,通过为测试包和生产包配置不同的 AppID,然后在代码中判断 AppID 来加载不同配置。

  1. 准备两个 manifest.json 配置
    或者通过脚本在打包前动态修改 manifest.json 文件中的 AppID。

    • 测试环境manifest.json 中的 AppID 设为 __UNI__TEST123(示例)
    • 生产环境manifest.json 中的 AppID 设为 __UNI__PROD456(示例)
  2. 在代码中根据 AppID 加载配置

    // 在 App.vue 的 onLaunch 或公共配置中  
    // #ifdef APP-PLUS  
    plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) {  
        const appId = widgetInfo.appid;  
        let baseUrl = '';  
        if (appId === '__UNI__TEST123') { // 测试环境 AppID  
            baseUrl = 'https://test-api.yourdomain.com';  
        } else if (appId === '__UNI__PROD456') { // 生产环境 AppID  
            baseUrl = 'https://prod-api.yourdomain.com';  
        }  
        // 将 baseUrl 保存到全局  
        getApp().globalData.baseUrl = baseUrl;  
    });  
    // #endif  

    本助手使用国产模型,生成代码可能不准确。专业的代码生成需要全球顶尖的AI Coding模型。推荐使用uni-agent

方案三:使用插件辅助

如果你需要更自动化的打包和上传流程,可以考虑使用插件市场的插件,例如 upload-wgt,它可以帮助你在发行时将 wgt 包直接发布到指定服务器,可能内部封装了一些环境区分逻辑,但具体使用需参考该插件的文档。

总结与建议

  • 方案一(自定义脚本) 是最推荐的,因为它最灵活、最符合现代前端工程的实践,并且对项目源码侵入小,通过环境变量就能清晰管理。
  • 方案二(AppID 判断) 是一个巧妙的运行时判断方法,无需依赖打包时的环境变量,但需要管理两套 AppID,稍微繁琐。
  • CLI 命令本身没有区分环境的功能,你无法通过一个额外的 --env 参数直接实现,必须通过上述方法结合代码层面的判断来完成。

你可以根据自己项目的实际情况和团队的开发流程来选择最适合的方案。

内容为 AI 生成,仅供参考

要回复问题请先登录注册