1. uniapp是什么
Uniapp是一个使用vue语法开发跨平台应用的框架,可以同时开发iOS,安卓和Web应用。
Vue.js + 小程序 + App 打造像 vue 一样开发小程序、H5、App 的框架
2. uniapp命令行工具
2.1 uniapp-cli是什么
uniapp-cli是uniapp官方提供的命令行工具,可以帮助开发者创建,编译和构建uniapp项目。
2.2 uniapp-cli的安装
使用npm命令安装uniapp-cli:
$ npm install -g @vue/cli @vue/cli-service-global uniapp-cli
安装完毕后,使用uniapp命令来创建新的uniapp项目:
$ uniapp create myapp
这将会在当前目录下创建一个名为myapp的uniapp项目。
2.3 uniapp-cli常用命令
uniapp serve:运行uniapp开发服务器,实时预览项目
uniapp build:使用webpack构建uniapp项目
uniapp build --mode development:构建开发环境的uniapp项目
uniapp build --mode production:构建生产环境的uniapp项目
3. uniapp项目的运行
3.1 运行uniapp项目到安卓/iOS应用
在uniapp项目根目录下运行以下命令:
$ uniapp build --platform android/ios
这将会编译Android或iOS应用,并将输出文件保存在/dist/目录下。
3.2 运行uniapp项目到Web应用
在uniapp项目根目录下运行以下命令:
$ uniapp serve --port 8080
这将会开启一个Web服务器,实时预览Web应用。
3.3 运行uniapp项目到微信小程序
首先需要在微信公众平台申请小程序账号,并获取AppID。
在uniapp项目的manifest.json文件中设置小程序的AppID:
"mp-weixin": {
"appid": "YOUR_APP_ID"
}
然后在uniapp项目根目录下运行以下命令:
$ uniapp build --platform mp-weixin
这将会编译微信小程序,并将输出文件保存在/dist/dev/mp-weixin/目录下。
4. 总结
通过uniapp-cli命令行工具,我们可以方便地创建,编译和构建uniapp项目,同时还可以运行uniapp项目到多个平台上。
开发者只需要学习一种语法,即可开发跨平台应用,提高开发效率。