当前位置:首页 > uni-app

uniapp 命令行

2026-03-05 14:15:23uni-app

uniapp 命令行操作指南

创建项目

使用 vue-cli 创建 uni-app 项目,需全局安装 @vue/cli。运行以下命令初始化项目:

npm install -g @vue/cli
vue create -p dcloudio/uni-preset-vue my-project

选择模板(默认模板、自定义模板等)后完成创建。

运行项目

进入项目目录后,通过以下命令运行到不同平台:

# 运行到H5
npm run dev:h5

# 运行到微信小程序
npm run dev:mp-weixin

# 运行到支付宝小程序
npm run dev:mp-alipay

打包项目

生产环境打包命令如下:

# 打包H5
npm run build:h5

# 打包微信小程序
npm run build:mp-weixin

# 打包支付宝小程序
npm run build:mp-alipay

自定义条件编译

通过 --mode 指定平台变量,例如:

npm run dev:mp-weixin --mode development

常用工具命令

  • 安装依赖npm install
  • 更新依赖npm update
  • 清除缓存npm run clean(需配置脚本)

CLI插件扩展

通过 vue-cli-plugin-uni 扩展功能,例如添加自动化测试:

vue add uni-test

环境变量配置

在项目根目录创建 .env 文件,定义变量:

VUE_APP_API_URL=https://api.example.com

通过 process.env.VUE_APP_API_URL 调用。

uniapp 命令行

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

相关文章

uniapp发布到应用商店

uniapp发布到应用商店

发布到苹果App Store 确保开发者账号已注册并加入Apple Developer Program,年费99美元。在Xcode中生成iOS发布证书(.p12)和描述文件(Provisioning…

uniapp前端页面

uniapp前端页面

Uniapp 前端页面开发指南 Uniapp 是一个基于 Vue.js 的跨平台开发框架,支持一次开发,多端部署(H5、小程序、App等)。以下是开发 Uniapp 前端页面的关键方法和注意事项。…

uniapp设置背景

uniapp设置背景

设置全局背景样式 在App.vue文件中添加全局样式,使用page选择器设置页面背景。这种方式会影响所有页面背景。 <style> page { background-col…

uniapp swiper禁止滑动

uniapp swiper禁止滑动

禁用 Swiper 滑动的方法 在 UniApp 中,可以通过设置 disableTouch 属性或动态绑定 touchable 属性来禁止 Swiper 组件的滑动行为。 方法一:通过 disab…

uniapp斑马

uniapp斑马

uniapp 斑马相关问题解答 uniapp 斑马打印机连接与使用 uniapp 支持通过蓝牙或网络连接斑马打印机,需要借助原生插件或第三方 SDK。以下为常见方法: 蓝牙连接方式 安装 uni-…

uniapp 绘图

uniapp 绘图

uniapp 绘图方法 使用 Canvas 组件 uniapp 支持通过 canvas 组件实现绘图功能。在模板中声明 canvas 并设置宽度、高度和 ID,通过 JavaScript 调用绘图 A…