uniapp使用vur-cli新建项目并打包

新建项目

npm install -g @vue/cli
vue create -p dcloudio/uni-preset-vue my-project

在这里插入图片描述

  • 选择默认模板
  • npm run dev:h5 运行

安装sass和uview (npm安装失败)

bug:使用uni.scss中的变量或样式,<style lang="scss"> 必须加lang才会生效
bug:使用uview只需要安装 sass和 sass-loader即可,无需安装 node-scss
bug:npm装包失败,需要使用 yarn add 安装包即可

yarn add sass@1.49.8 sass-loader@8.0.2
yarn add uview-ui   
  • main.js
import uView from "uview-ui";
Vue.use(uView);
  • uni.scss
@import 'uview-ui/theme.scss';
  • pages.json(和pages平行)
"easycom": {
		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
	},
  • index.vue
<u-button type="primary">主要按钮</u-button>
<u-button type="success">成功按钮</u-button>
<u-button type="info">信息按钮</u-button>
<u-button type="warning">警告按钮</u-button>
<u-button type="error">危险按钮</u-button>

<style lang="scss">

打包

npm run build:h5

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

亚马逊鲲鹏系统六大优势

亚马逊鲲鹏系统六大优势凭借其独特的能力&#xff0c;完全模拟真实的人类行为。只需几个简单的步骤 就可以自由安排任务&#xff0c;让所有账户随时发挥最大的作用。 1、全自动化操作 可以全自动批量注册买家号、AI智能养号、全自动批量测评&#xff0c;模拟人类的操作行为例…

vue-element-admin 集成框架设置中文语言

首先拉取中文版分支代码 https://github.com/PanJiaChen/vue-element-admin/tree/i18n &#xff08;下载卡的话&#xff0c;下载小羊的压缩包&#xff0c;已上传资源&#xff09; \src\lang\index.js 改完dangdangdang可以啦

CSDN中调整图片和文本样式

1.调整图片比例 插入图片后&#xff0c;觉得图片比例不协调&#xff0c;想改小点。只需要在文件后缀加个参数即可&#xff1a;?pic_center 60x。 NOTE&#xff1a;等号左边一定要加个空格&#xff0c;否则格式不生效 2.修改字体颜色 如上 NOTE&#xff1a;等号左边一定要…

Leo赠书活动-07期 【嵌入式虚拟化技术与应用】文末送书

✅作者简介&#xff1a;大家好&#xff0c;我是Leo&#xff0c;热爱Java后端开发者&#xff0c;一个想要与大家共同进步的男人&#x1f609;&#x1f609; &#x1f34e;个人主页&#xff1a;Leo的博客 &#x1f49e;当前专栏&#xff1a; 赠书活动专栏 ✨特色专栏&#xff1a;…

UML与PlantUML简介

UML与PlantUML 1、UML与PlantUML概述2、PlantUML使用 1、UML与PlantUML概述 UML&#xff08;Unified Modeling Language&#xff09;是一种统一建模语言&#xff0c;为面向对象开发系统的产品进行说明、可视化、和编制文档的一种标准语言&#xff0c;独立于任何具体程序设计语言…

什么是伺服电机?Parker派克伺服电机盘点

一、什么是伺服电机&#xff1f; 要准确地定义伺服电机&#xff0c;我们首先需理解其核心特性&#xff1a;反馈与闭环控制。伺服电机凭借这些特性&#xff0c;能精确控制扭矩、速度或位置&#xff0c;即使在零速度下&#xff0c;也能保持足够的扭矩以锁定负载。 伺服电机与其…

RAW图像处理软件Capture One 23 Enterprise mac中文版功能特点

Capture One 23 Enterprise mac是一款专业的图像处理软件&#xff0c;旨在为企业用户提供高效、快速和灵活的工作流程。 Capture One 23 Enterprise mac软件的特点和功能 强大的图像编辑工具&#xff1a;Capture One 23 Enterprise提供了一系列强大的图像编辑工具&#xff0c;…

【Linux语音控制 安卓设备刷短视频 orangePi zero2 H616 (已开源) 】.md uptada:23/11/07

文章目录 H616_实现Ubuntu语音控制安卓设备刷短视频小美效果展示H616 ubuntu系统 安装adb智能公元 SU-03T 离线语音模组 固件制作配合串口实现 小美_控制安卓刷抖音 H616_实现Ubuntu语音控制安卓设备刷短视频 注意&#xff1a;orangePi zero2 H616 安装系统为ubuntu 小美效果…

Linux Centos配置邮件发送

Linux Centos配置邮件发送 这里使用的是外部发送邮件方式&#xff0c;也就是使用自己的账号发送 第一步 首先要开启STMP授权码&#xff0c;以QQ邮箱为例 配置文件 vim /etc/mail.rc找到之后在最下面添加如下 #邮箱set from3324855376qq.com #默认smtp发送&#xff0c;stmp…

自动驾驶系统激光雷达传感器反射率标定板

自动驾驶技术正在全球范围内快速发展和推广。在中国&#xff0c;自动驾驶技术也得到了高度重视和大力支持。中国政府已经出台了一系列政策&#xff0c;推动自动驾驶技术的发展和应用。例如&#xff0c;上海、北京等地已经开放了自动驾驶测试道路&#xff0c;并开展了自动驾驶公…

剑指JUC原理-17.CompletableFuture

&#x1f44f;作者简介&#xff1a;大家好&#xff0c;我是爱吃芝士的土豆倪&#xff0c;24届校招生Java选手&#xff0c;很高兴认识大家&#x1f4d5;系列专栏&#xff1a;Spring源码、JUC源码&#x1f525;如果感觉博主的文章还不错的话&#xff0c;请&#x1f44d;三连支持&…

Spring boot 整合grpc 运用

文章目录 GRPC基础概念&#xff1a;Protocol Buffers&#xff1a;proto 基础语法&#xff1a;调用类型&#xff1a; Spring boot 整合 grpc项目结构&#xff1a;整合代码&#xff1a;父 pomproto 模块服务端&#xff1a;客户端&#xff1a;实际调用&#xff1a; 原生集成 GRPC基…

【uniapp/uview】Collapse 折叠面板更改右侧小箭头图标

最终效果是这样的&#xff1a; 官方没有给出相关配置项&#xff0c;后来发现小箭头不是 uview 的图标&#xff0c;而是 unicode 编码&#xff0c;具体代码&#xff1a; // 箭头图标 ::v-deep .uicon-arrow-down[data-v-6e20bb40]:before {content: \1f783; }附一个查询其他 u…

机器学习 - 决策树:技术全解与案例实战

目录 一、引言二、决策树基础决策树模型概述构建决策树的关键概念特征选择决策树的生成 决策树的剪枝 三、算法研究进阶提升树和随机森林提升树&#xff08;Boosted Trees&#xff09;随机森林&#xff08;Random Forests&#xff09; 进化算法与决策树决策树结构的进化 多目标…

MeterSphere 任意文件读取漏洞(CVE-2023-25814)

MeterSphere 任意文件读取漏洞&#xff08;CVE-2023-25814&#xff09; 免责声明漏洞描述漏洞影响漏洞危害网络测绘Fofa: title"MeterSphere" 漏洞复现1. 构造poc2. 发送数据包3. 查看文件 免责声明 仅用于技术交流,目的是向相关安全人员展示漏洞利用方式,以便更好地…

亚马逊鲲鹏系统能做什么

亚马逊鲲鹏系统是一款能绕过亚马逊智能检测&#xff0c;完全模拟人类真实行为&#xff0c;通过模拟真实的人流量来帮助你提升你的产品排名&#xff0c;让你的产品出现在搜索首页&#xff0c;从而快速提高你的销售业绩的营销工具&#xff01; 主要的功能有批量注册买家号、AI智能…

Java 并发编程面试题——Condition 接口

目录 1.Condition 接口有什么作用&#xff1f;2.如何使用 Condition&#xff1f;3.Condition 中有哪些常用的方法&#xff1f;4.✨Condition 的底层实现原理是什么&#xff1f;4.1.等待队列4.2.等待4.3.通知 &#xff08;1&#xff09;参考书籍&#xff1a; 《Java 并发编程的艺…

RabbitMQ集群配置以及负载均衡配置

RabbitMQ集群配置以及负载均衡配置 环境配置集群配置安装rabbitmq启动rabbitmq开启远程登录添加用户并且授权用户添加数据存放目录和日志存放目录查看端口拷⻉erlang.cookie将mq-2、mq-3作为内存节点加⼊mq-1节点集群中查看集群状态添加一个新的队列 RabbitMq负载均衡配置-HAPr…

VUE element组件生成的全选框如何获取值

//先声明 const Selection ref([]);//获取 const handleSelectCodeForTicket (val) > {console.log(val);// values.value val;Selection.value [];val.forEach((v) > {Selection.value.push(v);});console.log(Selection.value); }; <el-table selection-change…

《QT从基础到进阶·十七》QCursor鼠标的不同位置坐标获取

一些常用鼠标图形&#xff1a; 鼠标光标相对于整个电脑屏幕的位置&#xff1a;QCursor::pos() 当前光标相对于当前窗口的位置&#xff1a;this->mapFromGlobal(QCursor::pos()) void MainWindow::mouseReleaseEvent(QMouseEvent* event) {QPoint pos event->pos(); …