微信小程序里配置less

介绍

在微信小程序里,样式文件的后缀名都是wxss,这导致一个问题,就是页面样式过多的时候,要写很多的类名来包裹,加大了工作量,还很有可能会写错样式。这时可以配置一个less,会大大提高代码编辑质量。

使用方式

  1. 打开 vscode 编辑器, 在扩展中,搜索less,并安装,如下所示:
    在这里插入图片描述
  2. 打开微信开发者工具,点击 扩展 按钮, 在更多里,选择 从已解包的扩展文件夹安装,如下所示:
    在这里插入图片描述
  3. 默认打开的文件夹,就是已经安装的扩展列表,在当前文件夹里,选择 mrcrowl.easy-less-2.0.0文件,点击确定即可,如下所示:
    在这里插入图片描述
  4. 点击确定后,会提示如下所示的信息,代码扩展导入成功,
    在这里插入图片描述
  5. 在微信开发者工具里选择顶部的设置按钮,在打开的弹窗页面里选择 编辑器 ----- 更多编辑器设置-----扩展----Easy LESS configuration -------在settings.json中编辑, 如下所示:
    在这里插入图片描述
  6. 在打开的设置文件里,找到 less.compile 设置项,并添加如下所示的代码,即可将后缀名为less的文件自动编译并转换为后缀名为.wxss的文件。
 "less.compile": {"compress": false,"sourceMap": false,"out": true,"outExt": ".wxss"}
  1. 接下来,在页面里,可以新建后缀名为less的样式文件,当保存样式时,会自动编译并生成一个同样名字的 .wxss样式文件。

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

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

相关文章

《小狗钱钱》阅读笔记(三)

目录 还会有各种各样的人取笑你,但也会有更多的人认可你 有的时候,疯狂的念头比普通的小目标更容易达到。当你定下大目标的时候,就意味着你必须付出比别人多得多的努力。 可是请你告诉我,你为什么不能因为做了一件自己喜欢的事…

framework通信机制—LiveData使用方法及原理

LiveData是一种可观察的数据存储器类。与常规的可观察类不同,LiveData 具有生命周期感知能力,意指它遵循其他应用组件(如 activity、fragment 或 service)的生命周期。这种感知能力可确保 LiveData 仅更新处于活跃生命周期状态的应…

模型量化笔记--对称量化和非对称量化

1–量化映射 量化映射的通用公式为: r S ( q − Z ) r S(q - Z) rS(q−Z) 其中r表示量化前数据的真实值,S表示缩放因子,q表示量化后的数值,Z表示零点 2–非对称量化 非对称量化需要一个偏移量Z来完成零点的映射,即量化前的零…

pg嵌套子查询

1.概念 查询里面还有查询 进阶版:关联子查询 2.相关运算符补充 in/all/any all:表中的所有内容遍历一边,等价与max some/any:表中任何一个,等价与min

汉得欧洲x甄知科技 | 携手共拓全球化布局,助力出海中企数智化发展

HAND Europe 荣幸获得华为云颁发的 GrowCloud 合作伙伴奖项,进一步巩固了其在企业数字化领域的重要地位。于 2023 年 10 月 5 日,HAND Europe 参加了华为云荷比卢峰会,并因其在全球拓展方面的杰出贡献而荣获 GrowCloud 合作伙伴奖项的认可。 …

C++新经典 | C++ 查漏补缺(内存)

目录 一、new和delete 1.new类对象时,括号问题 2.new做了什么事 3.delete做了什么事 4.new与malloc的区别 5.delete与free的区别 二、分配及释放内存 三、重载operator new和operator delete操作符 1.重载类中的operator new和operator delete操作符 &…

vue+element实现电商商城礼品代发网,商品、订单管理

一、项目效果图 1.首页 2.登录 版本2: 3.注册 4.找回密码 5.立即下单 6.商品详情 7.个人中心-工作台 8.个人中心-订单列表 9.订单中心-包裹列表 10.个人中心-工单管理 11.我的钱包 12.实名认证 13.升级vip 14.个人中心-推广赚钱 二、关键源码 1.路由配置 impor…

【机器学习】PyTorch-MNIST-手写字识别

文章目录 前言完成效果一、下载数据集手动下载代码下载MNIST数据集: 二、 展示图片三、DataLoader数据加载器四、搭建神经网络五、 训练和测试第一次运行: 六、优化模型第二次优化后运行: 七、完整代码八、手写板实现输入识别功能 前言 注意…

vue重修【005】自定义路由、插槽

文章目录 版权声明自定义指令指令初识指令中配置项指令语法指令值v-loading指令的封装分析实现 插槽默认插槽插槽默认值具名插槽作用域插槽使用步骤完整案例 版权声明 本博客的内容基于我个人学习黑马程序员课程的学习笔记整理而成。我特此声明,所有版权属于黑马程…

如何快速定位BUG?BUG定位技巧及测试人员定位的N板斧

很多测试人员可能会说,我的职责就是找到bug,至于找原因并修复,那是开发的事情,关我什么事? 好,我的回答是,如果您只想做一个测试人员最基本最本分的事情,那么可以这么想。但是&#…

微信批量发朋友圈,多个号同步

近年来,随着数字营销的飞速发展,越来越多的企业开始将客户引至微信,并通过群发广告和发布朋友圈等方式进行产品推广,以实现高效率、低成本和良好的转化效果。随着号多起来了,朋友圈推广工作变得愈发繁琐,需…

Vue3 + Nodejs 实战 ,文件上传项目--实现图片上传

目录 技术栈 1. 项目搭建前期工作(不算太详细) 前端 后端 2.配置基本的路由和静态页面 3.完成图片上传的页面(imageUp) 静态页面搭建 上传图片的接口 js逻辑 4.编写上传图片的接口 5.测试效果 结语 博客主页:専心_前端,javascript,mys…

TiDB 7.4 发版:正式兼容 MySQL 8.0

MySQL 是全球最受欢迎的开源数据库,长期位于 DB-Engines Ranking 排行榜第二名,在世界范围内拥有数量庞大的企业用户和开发者。然而,随着时间的推移,MySQL 用户正面临新挑战。Oracle 官宣将在 2023 年 10 月终止 MySQL 5.7 版本的…

2023,简历石沉大海?软件测试岗位真的已经饱和了....

各大互联网公司的接连裁员,政策限制的行业接连消失,让今年的求职雪上加霜,想躺平却没有资本,还有人说软件测试岗位饱和了,对此很多求职者深信不疑,因为投出去的简历回复的越来越少了。 另一面企业招人真的…

【halcon】halcon轮廓总结之select_contours_xld

前言 select_contours_xld 我认为是一个非常常用且实用的算子,用于对轮廓进行筛选。 简介 这段文档描述了一个名为"SelectContoursXld"的操作,用于根据不同特征选择XLD(XLD是一种图像数据表示形式,表示轮廓线&#x…

竞赛 深度学习+python+opencv实现动物识别 - 图像识别

文章目录 0 前言1 课题背景2 实现效果3 卷积神经网络3.1卷积层3.2 池化层3.3 激活函数:3.4 全连接层3.5 使用tensorflow中keras模块实现卷积神经网络 4 inception_v3网络5 最后 0 前言 🔥 优质竞赛项目系列,今天要分享的是 🚩 *…

Golang学习:基础知识篇(二)—— 数组及切片

Golang学习:基础知识篇(二)—— 数组及切片 前言什么是Golang?Go语言的基础语法数组声明数组初始化数组访问数组知识点补充 切片定义切片切片初始化len() 和 cap() 函数空(nil)切片切片截取append() 和 copy() 函数知识点补充 前言…

ubuntu20.04安装FTP服务

安装 sudo apt-get install vsftpd# 设置开机启动并启动ftp服务 systemctl enable vsftpd systemctl start vsftpd#查看其运行状态 systemctl status vsftpd #重启服务 systemctl restart vsftpdftp用户 sudo useradd -d /home/ftp/ftptest -m ftptest sudo passwd ftptest…

使用 Python 和蒙特卡罗计算未来股价走势以及历史波动率和隐含波动率

一、简介 预测金融市场是定量精度和全球经济细微差别的复杂融合。在这一探索中,蒙特卡罗模拟脱颖而出,成为首要的统计工具,指导我们对未来股票价格的理解。 这种方法以摩纳哥著名的蒙特卡洛赌场命名,并不依靠运气,而是植根于严格的概率模型。想象一下在受控环境中精心策划…

vue3后台管理框架之技术栈

vue3全家桶技术 基础构建: vue3vite4TypeScript 代码格式 : eslintprettystylelint git生命周期钩子: husky css预处理器: sass ui库: element-plus 模拟数据: mock 网络请求: axios 路由: vue…