uni-app 之 安装uView,安装scss/sass编译

news2024/10/6 12:24:19

uni-app 之 安装uView,安装scss/sass编译

image.png

image.png

image.png

点击HBuilder X 顶部,工具,插件安装,安装新插件

image.png

image.png

安装成功!

注意,一定要先登录才可以安装

image.png

1. 引入uView主JS库

在项目根目录中的main.js中,引入并使用uView的JS库,注意这两行要放在import Vue之后。

// main.js
import uView from '@/uni_modules/uview-ui'
Vue.use(uView)

image.png

#2. 在引入uView的全局SCSS主题文件

在项目根目录的uni.scss中引入此文件。

/* uni.scss */
@import '@/uni_modules/uview-ui/theme.scss';

image.png

#3. 引入uView基础样式

注意!

App.vue首行的位置引入,注意给style标签加入lang="scss"属性

<style lang="scss">
    /* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
    @import "@/uni_modules/uview-ui/index.scss";
</style>

image.png



然后就可以正常使用啦~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/971536.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【树形权限】树形列表权限互斥选择、el-tree设置禁用等等

需求&#xff1a;按照权限管理配置的数据权限树展开&#xff1b;点击查看按钮后进入其他指定机构选择弹窗为一树形结构 本文章对项目中出现得关键点进行总结。 一、实现如上树形列表 在 element 官方表格示例中&#xff0c;实现树形表格列表数据渲染&#xff0c;非常简单。只…

Java分别用BIO、NIO实现简单的客户端服务器通信

分别用BIO、NIO实现客户端服务器通信 BIONIONIO演示&#xff08;无Selector&#xff09;NIO演示&#xff08;Selector&#xff09; 前言&#xff1a; Java I/O模型发展以及Netty网络模型的设计思想 BIO Java BIO是Java平台上的BIO&#xff08;Blocking I/O&#xff09;模型&a…

Go语言在机器学习中有未来吗?

Go 是一种开源编程语言&#xff0c;最初由 Google 设计&#xff0c;用于优化系统级服务的构建和使用、在大型代码库上轻松工作&#xff0c;以及利用多核联网机器。 Go 于 2009 年推出&#xff0c;作为一种静态类型和编译型编程语言&#xff0c;深受 C 语言的影响&#xff0c;注…

Prometheus + grafana 的监控平台部署

一、Prometheus安装 tar -zxvf prometheus-2.44.0.linux-amd64.tar.gz -C /opt/module/ sudo chown -R bigdata:bigdata /opt/module/prometheus-2.44.0.linux-amd64 mv /opt/module/prometheus-2.44.0.linux-amd64 /opt/module/prometheus-2.44.0 ln -s /opt/module/promethe…

【深入解析spring cloud gateway】02 网关路由断言

一、断言(Predicate)的意义 断言是路由配置的一部分&#xff0c;当断言条件满足&#xff0c;即执行Filter的逻辑&#xff0c;如下例所示 spring:cloud:gateway:routes:- id: add_request_header_routeuri: https://example.orgpredicates:- Path/red/{segment}filters:- AddR…

OCELOT: Overlapped Cell on Tissue Dataset for Histopathology

OCELOT dataset D { ( x s , y s c , x l , y l t , c x , c y ) i } i 1 N \mathcal{D} \left\{\left(\mathbf{x}_s, \mathbf{y}_s^c, \mathbf{x}_l, \mathbf{y}_l^t, c_x, c_y\right)_i\right\}_{i1}^{N} D{(xs​,ysc​,xl​,ylt​,cx​,cy​)i​}i1N​ x s ∈ R 1024 1…

修复中间件log4j漏洞方案(直接更换漏洞jar包)

说明&#xff1a; 后台服务里面的log4j漏洞我们已经全部升级处理了&#xff0c;但是一些中间件镜像包里的log4j漏洞需要单独处理 解决办法以ElasticSearch7.6.2为例&#xff1a; 方法&#xff1a; &#xff08;1&#xff09;找到容器里面有哪些旧的log4j依赖包 &#xff08;…

023-从零搭建微服务-推送服务(三)

原【短信服务】更名【推送服务】 写在最前 如果这个项目让你有所收获&#xff0c;记得 Star 关注哦&#xff0c;这对我是非常不错的鼓励与支持。 源码地址&#xff08;后端&#xff09;&#xff1a;https://gitee.com/csps/mingyue 源码地址&#xff08;前端&#xff09;&a…

Java后端开发面试题——企业场景篇

单点登录这块怎么实现的 单点登录的英文名叫做&#xff1a;Single Sign On&#xff08;简称SSO&#xff09;,只需要登录一次&#xff0c;就可以访问所有信任的应用系统 JWT解决单点登录 用户访问其他系统&#xff0c;会在网关判断token是否有效 如果token无效则会返回401&am…

图神经网络和分子表征:4. PAINN

如果说 SchNet 带来了【3D】的火种&#xff0c;DimeNet 燃起了【几何】的火苗&#xff0c;那么 PAINN 则以星火燎原之势跨入 【等变】时代。 在 上一节 中&#xff0c;我们提到&#xff0c; PAINN 在看到 DimeNet 取得的成就之后&#xff0c;从另一个角度解决了三体几何问题&a…

css3对文字标签不同宽,不同高使用瀑布流对齐显示

<div class"wrapper" style"padding: 0;"><span class"wf-item task-tags text-center" v-for"(item,index) in data.categorys" :key"index">{{ item }}</span> </div>/* 名称瀑布流显示 */ .wrap…

基于PyTorch的交通标志目标检测系统

一、开发环境 Windows 10PyCharm 2021.3.2Python 3.7PyTorch 1.7.0 二、制作交通标志数据集&#xff0c;如下图 三、配置好数据集的地址&#xff0c;然后开始训练 python train.py --data traffic_data.yaml --cfg traffic_yolov5s.yaml --weights pretrained/yolov5s.pt --e…

嵌入式基础知识-DMA

本篇来介绍DMA的一些基础知识。 1 DMA简介 DMA&#xff08;Direct Memory Access&#xff09;,中文名为直接内存访问&#xff0c;它是一些计算机总线架构提供的功能&#xff0c;能使数据从附加设备&#xff08;如磁盘驱动器&#xff09;直接发送到计算机主板的内存上。对应嵌…

(笔记七)利用opencv进行形态学操作

&#xff08;1&#xff09;程序清单 形态学操作是一种图像处理技术&#xff0c;它基于数学形态学理论&#xff0c;用于改变图像的形状和结构。它主要通过结构元素的腐蚀和膨胀操作来实现。 #!/usr/bin/env python # -*- coding:utf-8 -*- """ author: LIFEI t…

2023-9-4 最大公约数

题目链接&#xff1a;最大公约数 #include <iostream>using namespace std;int gcd(int a, int b) {return b ? gcd(b, a % b) : a; }int main() {int n;cin >> n;while(n--){int a, b;cin >> a >> b;cout << gcd(a, b) << endl;}return …

uniapp 处理 分页请求

我的需求是手机上一个动态滚动列表&#xff0c;下拉到底部时&#xff0c;触发分页数据请求 uniapp上处理分页解决方案 主要看你是如何写出滚动条的。我想到的目前有三种 &#xff08;1&#xff09;页面滚动&#xff1a;直接使用onReachBottom方法&#xff0c;可以监听到达底部…

【python爬虫】16.爬虫知识点总结复习

文章目录 前言爬虫总复习工具解析与提取&#xff08;一&#xff09;解析与提取&#xff08;二&#xff09;更厉害的请求存储更多的爬虫更强大的爬虫——框架给爬虫加上翅膀 爬虫进阶路线指引解析与提取 存储数据分析与可视化更多的爬虫更强大的爬虫——框架项目训练 反爬虫应对…

8K视频来了,8K 视频编辑的最低系统要求

当今 RED、Canon、Ikegami、Sony 等公司的 8K 摄像机以及 8K 电视&#xff0c;许多视频内容制作人和电影制作人正在认真考虑 8K 拍摄、编辑和后期处理&#xff0c;需要什么样的系统来处理如此海量的数据&#xff1f; 中央处理器&#xff08;CPU&#xff09; 首先&#xff0c;…

Redis 集群环境案例安装步骤

1. 3主3从redis集群配置 1.1 找3台真实虚拟机&#xff0c;各自新建 mkdir -p /myredis/cluster 1.2 新建6个独立的redis实例服务 1.2.1 本次案例设计说明(ip有变化) https://processon.com/diagraming/5fe6d76ce401fd549c8fe708 1.2.2 IP: 192.168.111.175端门6381/端口6…

基于Matlab实现多个图像压缩案例(附上源码+数据集)

图像压缩是一种将图像数据量减少的技术&#xff0c;以减少存储空间和传输带宽的需求。在本文中&#xff0c;我们将介绍如何使用Matlab实现图像压缩。 文章目录 简单案例源码数据集下载 简单案例 首先&#xff0c;我们需要了解图像压缩的两种主要方法&#xff1a;有损压缩和无…