1 - 简介,环境搭建,多端运行

简介:

web ==》js、html、css

app ==》原生开发:Android   ios

    H5:把网页制作成手机端样式

    hybrid:混编开发(一部分用h5,一部门用js 调用原生功能代码)

    react-native:使用JS 开发,导出原生的手机端应用代码

小程序 ==》微信小程序、百度小程序、360、字节跳到...支付宝...

如果一个项目需要开发web端和app端两部分,需要程序员分别写代码,成本高工作量大,而uniapp只要一个人开发,就可以导出

 

环境搭建:(用其他vscode也可以代码编辑)

官网有特定的代码编辑器HBuilder,下载后左下角注册登录使用,

必须安装相关插件才可以方便正常使用(工具栏---插件安装),

插件==》安装新插件---核心插件(还可以点击下方前往插件市场安装)

    例如市场中搜索sass编译软件,使用HBuilder导入插件安装即可

    prettier(帮助代码格式化)

 

运行:

点击左上角项目包---新建项目---选择对应模板(创建成功)

项目可分别运行在web(网页)、app手机端、微信小程序上

1.在浏览器端运行

  打开man.js,右上角预览(此时只要前面安装了插件就可以在内置浏览器中预览成功)

  在外部浏览器端运行查看---点击左上角工具栏运行,或者是菜单栏点击运行----运行到浏览器端

 

2.微信小程序运行

  需下载微信小程序开发工具

  在HBuilder中设置---菜单栏运行---运行到小程序模拟器---运行设置---小程序运行配置(选择小程序开发工具位置)

  扫描登录微信开发工具---设置---安全(打开服务端口)---代理(选择使用系统代理)

  回到项目,打开man.js,运行(微信小程序)

 

3.手机端运行

  需要下载夜神模拟器(安卓模拟器,目前没有iso模拟器)

  运行到安卓手机上:

    在手机上开启开发者模式,然后再开发者选项中,开启USB调试,运行通过usb 安装软件,等功能

    在手机线连接手机和电脑

    手机有弹出框:是否运行调试(选择总是运行)

    其他弹出框:选择与数据传输有关的调试

 

  下载后安装夜神模拟器:

    模拟器默认是paid样式,右上角设置---性能设置----更改为手机端样式

  回到项目中打开man.js,运行到手机或模拟器打开,如果是真机直接打开检测到的手机

  如果是模拟器,不同模拟器带有不同的ADB路径,所以这个需要重新设置adb路径(例如这里找到安装的夜神模拟器的adb.exe文件路径更新即可),然后重启夜神模拟器,在项目运行监测到设备进行运行

 

posted on 2021-09-12 16:32  一名小学生呀  阅读(51)  评论(0)    收藏  举报

导航