使用uni-app
开发的一个app,一次开发兼容多个平台。 文档
涉及到的技术: vue
, vuex
。
- 需要安装
HBuilderx
, 下载地址
1,npm install 安装依赖包
2,在HBuilderx上点击运行到浏览器/真机/模拟器
common----------------------------------------------公共的js方法
-service.js---------------------------------------请求后台接口配置文件
-util.js------------------------------------------自定义工具方法
components------------------------------------------自定义组件
-common-------------------------------------------公共组件
-global-------------------------------------------全局组件
-footer_nav.vue---------------------------------动态配置的底部导航栏组件
-status_bar.vue---------------------------------状态栏组件
node_modules----------------------------------------第三方插件
pages-----------------------------------------------页面
-home---------------------------------------------首页相关页面
-login--------------------------------------------登录注册模块相关页面
-mine---------------------------------------------我的模块相关页面
-nearby-------------------------------------------附近模块相关页面
-shopCart-----------------------------------------购物车模块相关页面
-vipCenter----------------------------------------会员中心模块相关页面
-index.vue----------------------------------------app首页,配置管理各个模块首页
static----------------------------------------------静态文件
-css
-img
store-----------------------------------------------vuex状态管理
wxcomponents----------------------------------------微信小程序版组件(app可以用)
App.vue---------------------------------------------应用配置,用来配置App全局样式以及监听应用生命周期
manifest.json---------------------------------------置应用名称、appid、logo、版本等打包信息
pages.json------------------------------------------配置页面路由、导航条、选项卡等页面类信息
- 在
HBuilderx
编辑器的工具选项中选择插件安装,安装scss/sass编辑;- 在.vue文件中设置属性
<style lang="scss">
- 真机调试时,无法找到手机,需要重新启动编辑器;
- 通过WiFi连接手机调试, 参考地址