uni-app 引入**vant，colorUI,uView等并发布H5端_vant uview区别-程序员宅基地

以下以vant为例，发布H5

轻量、可靠的移动端 Vue 组件库，采用 MIT 开源协议, 目前github star 数9k+，是有赞的一套开源组件库。通过 Vant，可以快速搭建出风格统一的页面，提升开发效率。目前已有近 60+ 个组件，这些组件被广泛使用于有赞的各个移动端业务中此段搬的官网语句

#如何引入呢？
一：官方推荐了几种方法，具体写法就不复述了引入方法
本人用的是 npm 方式

# Vue 2 项目，安装 Vant 2：
	npm i vant -S
	 Vue 3 项目，安装 Vant 3：
	npm i vant@next -S

可以看见有多了一个node_modeules文件夹，这里面就是vant的相关文件了

上面这不是重点，上述只是为了下载文件，但要怎么用呢？
当然是全局引用

main.js ：

import Vant from 'vant';
Vue.use(Vant);

这只是引用了vant的组件模块！！！

不信啊？那就试试呗

找一个页面写入

<van-cell-group>
			<van-field v-model="username" required clearable label="用户名" icon="question-o" placeholder="请输入用户名"
				bind:click-icon="onClickIcon" />

			<van-field v-model="password" type="password" label="密码" placeholder="请输入密码" :border="false" required />
		</van-cell-group>

username: ‘’,password: ‘’ 这两个参数不要忘了哦

运行：–运行至内置浏览器或者小程序…
运行结果：

样式呢？css呢？为什么没有显示上呢？console也没有报错~~（我不知道，我没吃，别找我）~~

发生上述原因：没有引入css :vant的组件和css单独维护的，所以需要手动引入

 @import 'vant/lib/index.css'; // 需要放在 <style></style>标签里面

App.vue 文件添加即可

在这里插入图片描述
亲测只有这种方式才有样式

uni.css 引入按道理说应该是可以的，但试了发现不行哦，应该是我没找到方法吧，

当然以上的vant引入是全局引入

局部引入：

import Vant from 'vant';

@import 'vant/lib/index.css'; // 需要放在 <style></style>标签里面

效果有了啊，开发。。。开发完了又如何发布呢？

发行-网站-pc.web或手机H5
然后嘛，按照步骤走就可以了，在编译打包完成后会得到一个打包文件
在这里插入图片描述
把h5下面的文件拷贝到服务器即可

至于colorUI，uview 这类第三方UI框架在项目新建的时候选择即可，
在这里插入图片描述
至于用法嘛，，比vant似乎更简单一点咯，官网提示都挺全得
若是有问题可以私我哦

注：好久没写博客了，，手法生疏，抱歉请见谅

本文链接：https://blog.csdn.net/Cat_Friends_Dog/article/details/116459160

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

BUAA OS实验环境配置指南-2020年版[2020.5.22更新]-程序员宅基地

文章浏览阅读2.7k次。BUAA OS实验环境配置指南-2020年版文章目录BUAA OS实验环境配置指南-2020年版前言为什么要配环境？配置环境过程中的尝试完整配置教程准备工作安装虚拟机安装ELDK编译器64位系统的准备工作正式安装安装gxemul小小的准备工作正式安装安装IDE前言时至2020年，实验指导书上的配环境方法有一部分已经不能使用，网上的资料很多也过时了。笔者踩了无数坑终于把OS环境配置好了，为了避免后人继续踩坑，故将配置经验分享出来。本文也许也会在未来的某一天过时，因此读者阅读时，请注意本文的发布时间。为_buaa os

Linux系统基础知识-程序员宅基地

文章浏览阅读2.1w次，点赞29次，收藏309次。1.Linux基础Linux概念：Linux是一个以Intel系列CPU(CYRIX,AMD的CPU也可以)为硬件平台，完全免费的UNIX兼容系统，完全适用于个人的PC。它本身就是一个完整的32位的多用户多任务操作系统，因此不需要先安装DOS或其他的操作系统（MS Windows, OS2, MINIX…）就可以进行直接的安装。Linux版本：其发行版本有Ubuntu、Centos、redhat、debian、opensuse等等；其中ubuntu注重界面，Centos注重服务器。其内核版本可以通过un_linux系统基础知识

【手势识别】基于matlab交警手势类型识别【含Matlab源码 3267期】_基于matlab的手势识别系统-程序员宅基地

文章浏览阅读167次。I交警手势类型识别完整代码，直接运行，适合小白！可提供运行操作视频！_基于matlab的手势识别系统

（附源码）ssm+vue.js+mysql+基于ssm店铺评价系统设计与实现毕业设计201524_店铺评价app的开发过程-程序员宅基地

文章浏览阅读1.8k次，点赞6次，收藏9次。店铺评论系统主要功能模块包括站点管理（轮播图、公告栏）、用户管理（管理员）、内容管理（文章、文章类型）、更多管理(学生、商家、商品信息、购物车)，采取面对对象的开发模式进行软件的开发和硬体的架设，能很好的满足实际使用的需求，完善了对应的软体架设以及程序编码的工作，采取MySQL作为后台数据的主要存储单元，采用SSM框架、Java技术、Ajax技术进行业务系统的编码及其开发，实现了本系统的全部功能。本次报告，首先分析了研究的背景、作用、意义，为研究工作的合理性打下了基础。针对店铺评论系统的各项需求以及技术问题_店铺评价app的开发过程

Android富文本编辑器进阶版（干货，IOS可照搬逻辑）_android原生富文本编辑器-程序员宅基地

文章浏览阅读6.6k次，点赞4次，收藏37次。#本文主要是讲解部分原理，源码及其使用请移步Githubhttps://github.com/RexSuper/RichEditorAPK:https://github.com/RexSuper/RichEditor/blob/master/RichHtmlEditorforAndroid/sample/release/sample-release.apkDemohttps://g..._android原生富文本编辑器

盈趣科技嵌入式面试总结_厦门盈趣科技上班怎么样-程序员宅基地

文章浏览阅读459次。时间：2021年4月6日公司：盈趣科技–嵌入式驱动开发工程师面试流程前台填写应聘基本信息表 – 5分钟技术官机试考核并问答面试 – 30分钟面试总结失败原因：招聘岗位与自我掌握知识不符合，这家公司的驱动开发工作内容更偏向于Android开发。面试问题多为Android的外围设备驱动开发以及与上层通讯交互流程的深究，在数据流程等问题须加深总结学习。面试题分析1、TP驱动开发流程？需要注意的点？以及如何调试？Android/Linux TP驱动移植调试一般包括以下几个流程：当手指接_厦门盈趣科技上班怎么样

随便推点

C语言实验报告5_56学时_c语言定义double型数组-程序员宅基地

文章浏览阅读955次，点赞4次，收藏5次。指针实验实验一题目:原样输入实验指导书实验六exp6_1.c源代码。要求：① 编辑、编译、链接并运行程序，观察运行结果。② 观察4个用于交换的函数，观察对应的形参与实参，注意正确的调用形式。分析为什么有的能实现实参变量的交换而有的不能。③ 用F10键单步跟踪程序，运行到函数调用语句时改用F11键，进入被调函数内再用F10键观察每一步程序运行时实参与形参的作用域以及值的变化情况。源代码：`#include 实验二题目：定义一维数组和一级指针double array[10]，*p，并依.._c语言定义double型数组

SIFT和SURF特征提取分析(小结篇)_sift surf计算复杂度-程序员宅基地

文章浏览阅读695次。原文 http://blog.csdn.net/songzitea/article/details/18271091 主题特征选择高斯引言本节主要是David Lowe对于SIFT算法的阐述Distinctive Image Features from Scale-Invariant Keypoints和Herbert Bay, Andreas _sift surf计算复杂度

使用micropython+pycharm开发ESP32_pycharm micropython esp32-程序员宅基地

文章浏览阅读8.7k次，点赞12次，收藏77次。使用micropython+pycharm开发ESP321.安装pycharm此步骤略去，CSDN上有大量参考文章。2.配置pycharm环境1.进入file->setting->plugins安装BetterInterllij和micropython模块2.进入language里找到micropython选择Enable micropython support，devicetype选择pybord。将ESP32使用数据线连接电脑，在device path里选择esp32对应的com_pycharm micropython esp32

Nginx学习+安装_zlib-devel安装-程序员宅基地

文章浏览阅读1.1k次。Nginx学习_zlib-devel安装

智能菜品量推荐——RapidMiner（一）_餐饮平台菜品智能推荐-程序员宅基地

文章浏览阅读1.5k次。前言本文是一篇阅读RapidMiner手册，结合当下目标产品做出的文字概述总结。RapidMiner与本产品需求非常贴切，对其进行理解与整理，贴出作为记录与项目书素材。餐饮业盈利核心在于菜品与顾客。什么样的菜系和种类会吸引更多的顾客，每个客户的就餐喜好是什么，不同时期什么样的菜品最为畅销，能否通过几种不同菜品的组合达到更好的效果，是否可预测未来一段时间内菜品原材料的采购份量？一、无技术支撑下已有数据可以干什么？ ① 点餐前，由有经验的服务员对顾客进行菜品..._餐饮平台菜品智能推荐

TD-LTE与通信技术的协同发展_lte的调制技术引入了高阶编码调制方式-程序员宅基地

文章浏览阅读48次。TD-LTE系统中的分组交换技术能够根据不同的业务需求对数据进行灵活的调度和优先级处理，从而提高了系统的整体性能和用户体验。同时，基于IP网络的架构使得TD-LTE能够与其他网络（如互联网和传统的电信网络）进行无缝连接和互操作，实现了多种业务的集成和漫游。通过先进的调制和编码技术、多天线技术以及分组交换和IP网络的应用，TD-LTE实现了更高的频谱效率、容量和灵活性。在TD-LTE的协同发展过程中，通信技术起着重要的作用。通信技术的不断创新和进步，为TD-LTE提供了更高的性能和更好的用户体验。_lte的调制技术引入了高阶编码调制方式