当前位置:首页 > uni-app

uniapp命令行编译

2026-02-06 16:56:15uni-app

uniapp 命令行编译方法

uniapp 支持通过命令行工具进行项目编译,适用于自动化构建或集成到 CI/CD 流程中。以下是常用的命令行编译方式:

安装依赖 确保已安装 Node.js 和 HBuilderX 命令行工具(cli)。全局安装 @dcloudio/uni-cli

npm install -g @dcloudio/uni-cli

编译到不同平台

  • H5 平台

    npm run build:h5
    # 或使用自定义配置
    uni build --platform h5
  • 微信小程序

    uniapp命令行编译

    npm run build:mp-weixin
    # 或
    uni build --platform mp-weixin
  • App 平台

    npm run build:app-plus
    # 或
    uni build --platform app-plus

自定义配置参数

通过 -- 传递额外参数:

uni build --platform h5 --mode production --dest ./output
  • --mode:指定环境(如 development/production)。
  • --dest:自定义输出目录。

环境变量注入

在项目根目录创建 .env 文件,通过 --mode 指定环境:

uniapp命令行编译

# .env.production
VUE_APP_API_BASE=https://api.example.com

编译时注入变量:

uni build --platform h5 --mode production

自动化脚本示例

package.json 中添加脚本:

{
  "scripts": {
    "build:weapp": "uni build --platform mp-weixin --mode production",
    "build:h5": "uni build --platform h5 --dest ./dist/h5"
  }
}

运行脚本:

npm run build:weapp

注意事项

  • 确保项目已安装必要依赖(如 @dcloudio/uni-ui)。
  • App 平台编译需依赖 HBuilderX,需配置 cli 路径。
  • 小程序平台编译后需手动上传或通过 CI 工具处理。

标签: 命令行uniapp
分享给朋友:

相关文章

uniapp前端项目

uniapp前端项目

Uniapp 前端项目开发指南 Uniapp 是一个基于 Vue.js 的跨平台开发框架,支持一次开发,多端发布(如微信小程序、H5、App 等)。以下是关于 Uniapp 前端项目的关键信息: 环…

uniapp实现懒加载

uniapp实现懒加载

uniapp实现懒加载的方法 在uniapp中实现懒加载可以通过多种方式,以下是几种常见的方法: 使用uni.lazyLoad组件 uniapp提供了内置的懒加载组件,适用于图片等资源的懒加载。在页…

uniapp隐藏右侧滚动条

uniapp隐藏右侧滚动条

隐藏右侧滚动条的方法 在UniApp中隐藏右侧滚动条可以通过CSS样式实现,适用于H5、小程序等平台。以下是几种常见的方法: 全局样式设置 在App.vue的全局样式中添加以下CSS代码,适用于所有…

uniapp特性

uniapp特性

uniapp的核心特性 跨平台开发 uniapp支持一套代码编译到多个平台,包括iOS、Android、H5、微信小程序、支付宝小程序、百度小程序、字节跳动小程序等。开发者无需为不同平台单独编写代码。…

任务 uniapp

任务 uniapp

uniapp 简介 Uniapp 是一款基于 Vue.js 的跨平台开发框架,支持一次开发,多端发布(如微信小程序、H5、App、快应用等)。其核心优势在于代码复用率高,开发者可以通过一套代码适配多个…

uniapp 线程

uniapp 线程

uniapp 线程的概念 在 uniapp 中,线程的概念与原生应用开发有所不同。由于 uniapp 是基于 JavaScript 的运行环境,它并不直接支持多线程操作。JavaScript 本身是单…