1、uniapp 简介uni-app是一个使用 Vue.js 开发所有前端应用的框架开发者编写一套代码可发布到iOS、Android、鸿蒙Next、Web响应式、以及各种小程序微信/支付宝/百度/抖音/飞书/QQ/快手/钉钉/淘宝/京东/小红书、快应用、鸿蒙元服务等多个平台。DCloud公司拥有900万开发者、数百万应用、12亿手机端月活用户、数千款uni-app插件、70微信/qq群开发者可以放心选择。uni-app在手做啥都不愁。即使不跨端uni-app也是更好的小程序开发框架详见、更好的App跨平台框架、更方便的H5开发框架。不管领导安排什么样的项目你都可以快速交付不需要转换开发思维、不需要更改开发习惯。uniapp官网https://uniapp.dcloud.net.cn/快速上手https://uniapp.dcloud.net.cn/quickstart-hx.html2、下载安装HbuilderX开发工具HbuilderX https://www.dcloud.io/hbuilderx.html解压安装包运行HBuilderX 或者发送到桌面快捷方式后再运行3、打开HBuilderX 创建项目官方文档教程https://uniapp.dcloud.net.cn/quickstart-hx.html1创建项目菜单栏--文件--新建--项目2运行项目存在多个项目可以单独在新窗口打开运行项目点击访问链接查看到这里就已经成功实现uniapp项目的创建与运行了4、拓展uniapp目录结构官方文档https://uniapp.dcloud.net.cn/tutorial/project.html┌─uniCloud 云空间目录支付宝小程序云为uniCloud-alipay阿里云为uniCloud-aliyun腾讯云为uniCloud-tcb详见uniCloud │─components 符合vue组件规范的uni-app组件目录 │ └─comp-a.vue 可复用的a组件 ├─utssdk 存放uts文件已废弃 ├─pages 业务页面文件存放的目录 │ ├─index │ │ └─index.vue index页面 │ └─list │ └─list.vue list页面 ├─static 存放应用引用的本地静态资源如图片、视频等的目录注意静态资源都应存放于此目录 ├─uni_modules 存放uni_module 详见 ├─platforms 存放各平台专用页面的目录详见 ├─nativeplugins App原生语言插件 详见 ├─nativeResources App端原生资源目录 │ ├─android Android原生资源目录 详见 | └─ios iOS原生资源目录 详见 ├─hybrid App端存放本地html文件的目录详见 ├─wxcomponents 存放微信小程序、QQ小程序组件的目录详见 ├─mycomponents 存放支付宝小程序组件的目录详见 ├─swancomponents 存放百度小程序组件的目录详见 ├─ttcomponents 存放抖音小程序、飞书小程序组件的目录详见 ├─kscomponents 存放快手小程序组件的目录详见 ├─jdcomponents 存放京东小程序组件的目录详见 ├─unpackage 非工程代码一般存放运行或发行的编译结果 ├─main.js Vue初始化入口文件 ├─App.vue 应用配置用来配置App全局样式以及监听 应用生命周期 ├─pages.json 配置页面路由、导航条、选项卡等页面类信息详见 ├─manifest.json 配置应用名称、appid、logo、版本等打包信息详见 ├─AndroidManifest.xml Android原生应用清单文件 详见 ├─Info.plist iOS原生应用配置文件 详见 └─uni.scss 内置的常用样式变量
【uniapp】(1)创建uniapp项目并运行
1、uniapp 简介uni-app是一个使用 Vue.js 开发所有前端应用的框架开发者编写一套代码可发布到iOS、Android、鸿蒙Next、Web响应式、以及各种小程序微信/支付宝/百度/抖音/飞书/QQ/快手/钉钉/淘宝/京东/小红书、快应用、鸿蒙元服务等多个平台。DCloud公司拥有900万开发者、数百万应用、12亿手机端月活用户、数千款uni-app插件、70微信/qq群开发者可以放心选择。uni-app在手做啥都不愁。即使不跨端uni-app也是更好的小程序开发框架详见、更好的App跨平台框架、更方便的H5开发框架。不管领导安排什么样的项目你都可以快速交付不需要转换开发思维、不需要更改开发习惯。uniapp官网https://uniapp.dcloud.net.cn/快速上手https://uniapp.dcloud.net.cn/quickstart-hx.html2、下载安装HbuilderX开发工具HbuilderX https://www.dcloud.io/hbuilderx.html解压安装包运行HBuilderX 或者发送到桌面快捷方式后再运行3、打开HBuilderX 创建项目官方文档教程https://uniapp.dcloud.net.cn/quickstart-hx.html1创建项目菜单栏--文件--新建--项目2运行项目存在多个项目可以单独在新窗口打开运行项目点击访问链接查看到这里就已经成功实现uniapp项目的创建与运行了4、拓展uniapp目录结构官方文档https://uniapp.dcloud.net.cn/tutorial/project.html┌─uniCloud 云空间目录支付宝小程序云为uniCloud-alipay阿里云为uniCloud-aliyun腾讯云为uniCloud-tcb详见uniCloud │─components 符合vue组件规范的uni-app组件目录 │ └─comp-a.vue 可复用的a组件 ├─utssdk 存放uts文件已废弃 ├─pages 业务页面文件存放的目录 │ ├─index │ │ └─index.vue index页面 │ └─list │ └─list.vue list页面 ├─static 存放应用引用的本地静态资源如图片、视频等的目录注意静态资源都应存放于此目录 ├─uni_modules 存放uni_module 详见 ├─platforms 存放各平台专用页面的目录详见 ├─nativeplugins App原生语言插件 详见 ├─nativeResources App端原生资源目录 │ ├─android Android原生资源目录 详见 | └─ios iOS原生资源目录 详见 ├─hybrid App端存放本地html文件的目录详见 ├─wxcomponents 存放微信小程序、QQ小程序组件的目录详见 ├─mycomponents 存放支付宝小程序组件的目录详见 ├─swancomponents 存放百度小程序组件的目录详见 ├─ttcomponents 存放抖音小程序、飞书小程序组件的目录详见 ├─kscomponents 存放快手小程序组件的目录详见 ├─jdcomponents 存放京东小程序组件的目录详见 ├─unpackage 非工程代码一般存放运行或发行的编译结果 ├─main.js Vue初始化入口文件 ├─App.vue 应用配置用来配置App全局样式以及监听 应用生命周期 ├─pages.json 配置页面路由、导航条、选项卡等页面类信息详见 ├─manifest.json 配置应用名称、appid、logo、版本等打包信息详见 ├─AndroidManifest.xml Android原生应用清单文件 详见 ├─Info.plist iOS原生应用配置文件 详见 └─uni.scss 内置的常用样式变量
