当前位置:   article > 正文

uni-App框架的安装和简单使用_nuiapp前端怎么安装

nuiapp前端怎么安装
uni-App
  • 是一个使用vue.js的语法来开发所有前端的应用(比如微信小程序,百度小程序,抖音小程序等)
  • 安装(cmd)
  1. 打开cmd然后安装全局的cli

     npm install -g @vue/cli
    
    • 1
  2. 创建uni-App

    vue create -p dcloudio/uni-preset-vue my-project
    选择默认模板
    在这里插入图片描述
    进入my-project文件
    在这里插入图片描述

  3. 启动项目

     npm run dev:mp-weixin 
     跟mp-weixin对应的属性还有
     	1.app-plus :app平台生成打包资源(支持npm run build:app-plus,可用于持续集成。不支持run,运行调试仍需在HBuilderX中操作)
     	2.h5:	H5
     	3.mp-alipay:	支付宝小程序
     	4.mp-baidu:	百度小程序
     	5.mp-weixin:	微信小程序
     	6.mp-toutiao:	字节跳动小程序
     	7.mp-qq:		qq 小程序
     	8.mp-360:		360 小程序
     	9.quickapp-webview:	快应用(webview)
     	10.quickapp-webview-union:	快应用联盟
     	11.quickapp-webview-huawei:	快应用华为
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13

    出现下图就启动成功了
    在这里插入图片描述

  4. 打开开发者工具,把你的项目导入到微信开发者工具
    在这里插入图片描述

等你的小程序出现下图就好了
在这里插入图片描述
my-project文件中的目录介绍
在这里插入图片描述
基本使用

  • 在pages里面创建一个新的文件
  • 在pages.json中配置文件 就可以在小程序中看到你新文件的内容。注意你新创建的文件要放到前面
    在这里插入图片描述
    在这里插入图片描述

总结:

  • uni-App:他一个使用vue.js的语法来开发所有前端的框架
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Gausst松鼠会/article/detail/284162
推荐阅读
相关标签
  

闽ICP备14008679号