当前位置: 首页 > news >正文

postcss-px-to-viewport include属性

包含include配置的(github):npm i https://github.com/evrone/postcss-px-to-viewport -S

包含include配置的(npm):npm i postcss-px-to-viewport-8-with-include -S

不包含包include配置的(npm):npm i postcss-px-to-viewport

看了一下这篇文章,短期内就获得了很多浏览量,所以再详细说一下
1.第一次我使用的是: npm i postcss-px-to-viewport -S,配置include无效,是因为npm中的该插件内部其实并没有实现include
2.然后我就找到了第二个符合我条件的插件: npm i https://github.com/evrone/postcss-px-to-viewport,但是又发现,我们公司在部署的时候install 该插件的时候下载失败,应该就是链接github失败的问题
3.于是我又从npm中找符合条件的,于是找到了: npm i postcss-px-to-viewport-8-with-include -S,这个依赖虽然看起来每周的安装量很少,但是我安装后实测了一下,是完全没问题的。我的需求:我们平台突然新增了两个大屏界面,我并没有新开一个项目去写,就在后台管理系统新开了两个路由界面去写的,但是我又不想影响其他的界面,所以需要配置include让插件只对两个大屏界面生效
我的配置代码如下:
const loderPx2vw = px2vw({unitToConvert: 'px', // 需要转换的单位,默认为"px"viewportWidth: 1920, // 视窗的宽度,对应pc设计稿的宽度viewportHeight: 1080, // 视窗的高度,对应的是我们设计稿的高度unitPrecision: 2, // 单位转换后保留的精度propList: [// 能转化为vw的属性列表'*',],viewportUnit: 'vw', // 希望使用的视口单位fontViewportUnit: 'vw', // 字体使用的视口单位selectorBlackList: [], // 需要忽略的CSS选择器,不会转为视口单位,使用原有的px等单位。minPixelValue: 1, // 设置最小的转换数值,如果为1的话,只有大于1的值会被转换mediaQuery: false, // 媒体查询里的单位是否需要转换单位replace: true, // 是否直接更换属性值,而不添加备用属性exclude: [/node_modules/], // 忽略某些文件夹下的文件或特定文件,例如 'node_modules' 下的文件include: [/src\/views\/screenPage\//],
});

相关文章:

postcss-px-to-viewport include属性

包含include配置的(github):npm i https://github.com/evrone/postcss-px-to-viewport -S 包含include配置的(npm):npm i postcss-px-to-viewport-8-with-include -S 不包含包include配置的(npm):npm i postcss-px-to-viewport 看了一下这篇文…...

C++设计模式——抽象工厂模式

文章目录 抽象工厂模式的主要组成部分抽象工厂模式的一个典型例子抽象工厂模式用于其他场景抽象工厂模式与其他设计模式结合使用 C 中的抽象工厂模式是一种创建型设计模式,它主要用于处理对象家族的创建,这些对象之间可能存在一定的关联关系或属于相同的…...

Windows安装VNC连接工具并结合cpolar实现远程内网Ubuntu系统桌面

文章目录 前言1. ubuntu安装VNC2. 设置vnc开机启动3. windows 安装VNC viewer连接工具4. 内网穿透4.1 安装cpolar【支持使用一键脚本命令安装】4.2 创建隧道映射4.3 测试公网远程访问 5. 配置固定TCP地址5.1 保留一个固定的公网TCP端口地址5.2 配置固定公网TCP端口地址5.3 测试…...

Vue3 Hooks函数使用及封装思想

一、什么是Hooks函数? 想象一下,你在做饭,有一些调料你经常会用到,比如盐、酱油和辣椒。每次做饭时,你都会从柜子里拿出这些调料。如果你每次用完都把它们随便放在厨房的某个角落,下次做饭时就可能找不到它…...

YOLOv8改进涨点,添加GSConv+Slim Neck,有效提升目标检测效果,代码改进(超详细)

目录 摘要 主要想法 GSConv GSConv代码实现 slim-neck slim-neck代码实现 yaml文件 完整代码分享 总结 摘要 目标检测是计算机视觉中重要的下游任务。对于车载边缘计算平台来说,巨大的模型很难达到实时检测的要求。而且,由大量深度可分离卷积层构…...

华为s5720s-28p-power-li-ac堆叠配置

叠物理约束: • 连线推荐示意图选用产品子系列中固定的一款设备做示例,与选择产品时指定型号的外观可能不同。示意图主要用于让用户了解相同子系列设备可以用作堆叠的端口的位置,以及使用不同的连线方式时如何连接设备上的端口。因此&#xf…...

c# aes加密解密私钥公钥通钥

using System.Security.Cryptography; using System.Text; namespace EncryptTest { internal class Program { static void Main(string[] args) { Console.WriteLine("Hello, World!"); string 密 EncryptAESBASE64("你…...

上拉电阻与下拉电阻、电容的作用

上拉电阻与下拉电阻 在单片机电路中,上拉电阻和下拉电阻都是常见的电路元件,它们在数字电路设计中扮演着重要的角色。它们的作用如下: 1. **上拉电阻**: - **作用**:当一个引脚没有外部信号时,上拉电阻…...

《Spring Security 简易速速上手小册》第1章 Spring Security 概述(2024 最新版)

文章目录 1.1 Spring Security 的重要性1.1.1 基础知识详解1.1.2 主要案例:用户认证与授权1.1.3 拓展案例 1:OAuth2 社交登录1.1.4 拓展案例 2:JWT 认证 1.2 Spring Security 的核心特性1.2.1 基础知识详解1.2.2 主要案例:基于角色…...

vue页面菜单权限问题解决

带锚点的url,#后面部分后端获取不到. vue的页面是带有#的路由,#后端服务获取不到,只在浏览器端有用. URL 中的哈希符号 (#) 被用来作为网页中的 锚点 使用,锚点的含义就是页面中的某个特定的位置,这个位置可以被快速找到,很类似于在该位置抛…...

C++面试宝典第33题:数组组成最大数

题目 给定一组非负整数nums,重新排列每个数的顺序(每个数不可拆分)使之组成一个最大的整数。注意:输出结果可能非常大,所以你需要返回一个字符串而不是整数。 示例1: 输入:nums = [10, 2] 输出:"210" 示例2: 输入:nums = [3, 30, 34, 5, 9] 输出:"…...

“影像承载初心” 国际数字影像产业园2024首届摄影沙龙诚邀您的参与!

2024年2月29日,树莓集团总部国际数字影像产业园将举行“影像承载初心”2024首届摄影沙龙,活动现场邀请摄影业内大咖与专家共聚成都文创产业园,探讨摄影艺术及影像未来。诚邀您的参与! 国际数字影像产业园介绍: 国际数…...

【C语言】while循环语句

🎈个人主页:豌豆射手^ 🎉欢迎 👍点赞✍评论⭐收藏 🤗收录专栏:C语言 🤝希望本文对您有所裨益,如有不足之处,欢迎在评论区提出指正,让我们共同学习、交流进步&…...

2024数字中国创新大赛·数据要素赛道“能源大数据应用赛”正式上线!参赛指南请查收

近日,由国网福建电力承办的2024数字中国创新大赛能源大数据应用赛正式上线发布。赛事按照数字中国建设、能源革命的战略要求,围绕能源数据要素x、能源数字技术、能源商业模式等热点设置赛题,诚邀社会各界为加快建成新型电力系统出谋划策&…...

react-JSX基本使用

1.目标 能够知道什么是JSX 能够使用JSX创建React元素 能够在JSX中使用JS表达式 能够使用JSX的条件渲染和列表渲染 能够给JSX添加样式 2.目录 JSX的基本使用 JSX中使用JS表达式 JSX的条件渲染 JSX的列表渲染 JSX的样式处理 3.JSX的基本使用 3.1 createElement()的问题 A. …...

学习阶段单片机买esp32还是stm32?

学习阶段单片机买esp32还是stm32? 在开始前我有一些资料,是我根据网友给的问题精心整理了一份「stm32的资料从专业入门到高级教程」, 点个关注在评论区回复“888”之后私信回复“888”,全部无偿共享给大家!!&#xf…...

【Simulink系列】——Simulink子系统子系统封装模块库技术

声明:本系列博客参考有关专业书籍,截图均为自己实操,仅供交流学习! 引入 前面对于简单的动态系统仿真,可以直接建立模型,然后仿真。但是对于复杂的系统,直接建立系统会显得杂乱无章&#xff0…...

一加手机线刷2024版,param预载失败/MSM刷机工具报错

如果之前有刷第三方或者手机出问题,先去下载9008线刷包,可以去去大侠阿木的网站搜索。 这次的主题是param刷机报错,当你确保端口提示有QCOM端口,没有感叹号你需要先卸载设备及其驱动,重新插上手机,在WINDO…...

文件拖放到窗体事件

网上的实现1 实现结果 具体实现代码:注意需要使能允许拖拽 public partial class Form1 : Form {public Form1(){InitializeComponent();this.AllowDrop true; //允许拖拽}private void Form1_DragEnter(object sender, DragEventArgs e){this.Text DateTime.No…...

JAVA集成微信支付V3版JSAPI下单

一、引入微信支付SDK <dependency><groupId>com.github.binarywang</groupId><artifactId>weixin-java-pay</artifactId> </dependency> 二、支付参数封装 Data ConfigurationProperties(prefix "wx.pay") public class WxP…...

Lattice Planner实战避坑指南:从Frenet坐标推导到轨迹拼接,这些细节决定了成败

Lattice Planner深度调优实战&#xff1a;Frenet坐标转换与轨迹拼接的工程化解决方案 在自动驾驶规划算法领域&#xff0c;Lattice Planner因其数学优雅性和工程实用性成为主流选择。但当工程师真正将其落地时&#xff0c;往往会遭遇理论推导与工程实现间的巨大鸿沟——那些论文…...

AGI到底强在哪?2026奇点大会首次公开12维能力评估矩阵:含推理深度、跨域泛化率、因果鲁棒性实测数据

第一章&#xff1a;2026奇点智能技术大会&#xff1a;AGI的能力评估 2026奇点智能技术大会(https://ml-summit.org) 本届大会首次设立跨模态通用智能基准&#xff08;Cross-Modal General Intelligence Benchmark, CGIB&#xff09;&#xff0c;面向全球开源社区发布统一评估…...

无名杀:免费开源的三国杀网页游戏终极体验指南

无名杀&#xff1a;免费开源的三国杀网页游戏终极体验指南 【免费下载链接】noname 项目地址: https://gitcode.com/GitHub_Trending/no/noname 无名杀是一款完全免费、开源的网页版三国杀游戏&#xff0c;将经典的三国杀玩法与现代Web技术完美结合。这款游戏不仅忠实还…...

G-Helper:华硕笔记本性能调优的轻量级革命,三步解锁硬件控制新境界

G-Helper&#xff1a;华硕笔记本性能调优的轻量级革命&#xff0c;三步解锁硬件控制新境界 【免费下载链接】g-helper Lightweight, open-source control tool for ASUS laptops and ROG Ally. Manage performance modes, fans, GPU, battery, and RGB lighting across Zephyru…...

3步搭建你的专属麻将AI教练:Akagi实战指南

3步搭建你的专属麻将AI教练&#xff1a;Akagi实战指南 【免费下载链接】Akagi 支持雀魂、天鳳、麻雀一番街、天月麻將&#xff0c;能夠使用自定義的AI模型實時分析對局並給出建議&#xff0c;內建Mortal AI作為示例。 Supports Majsoul, Tenhou, Riichi City, Amatsuki, with t…...

用Java Stream一行代码搞定彩票随机选号(双色球/大乐透)

用Java Stream一行代码搞定彩票随机选号&#xff08;双色球/大乐透&#xff09; 每次路过彩票站&#xff0c;总忍不住想试试手气。但机选号码总感觉少了点参与感&#xff1f;不如用Java Stream API自己写个随机选号器&#xff0c;既锻炼编码能力又能享受"定制化"选号…...

Linux 命名空间(Namespace)实战指南:从原理到容器化应用

1. Linux命名空间&#xff1a;容器技术的隐形骨架 第一次听说Linux命名空间时&#xff0c;我正被Docker容器里"独立"的进程树和网络配置搞得一头雾水。直到有天用lsns命令看到容器进程背后那些带方括号的ns标识&#xff0c;才恍然大悟——原来每个容器都是被命名空间…...

用NumPy玩转蒙特卡洛模拟:手把手教你用随机数估算圆周率π和期权价格

用NumPy玩转蒙特卡洛模拟&#xff1a;手把手教你用随机数估算圆周率π和期权价格 蒙特卡洛模拟就像一场数学魔术表演——通过随机撒点就能算出圆周率&#xff0c;通过模拟股票走势就能预测期权价格。这种将概率游戏变成科学计算利器的技术&#xff0c;正在金融工程、物理仿真等…...

OpenIPC完整指南:5分钟掌握开源摄像头固件的终极改造方案 [特殊字符]

OpenIPC完整指南&#xff1a;5分钟掌握开源摄像头固件的终极改造方案 &#x1f680; 【免费下载链接】firmware Alternative IP Camera firmware from an open community 项目地址: https://gitcode.com/gh_mirrors/fir/firmware 还在为网络摄像头的封闭固件而烦恼吗&am…...

Windows流媒体服务器终极指南:从SRS到WSL的完美迁移方案

Windows流媒体服务器终极指南&#xff1a;从SRS到WSL的完美迁移方案 【免费下载链接】srs-windows 项目地址: https://gitcode.com/gh_mirrors/sr/srs-windows 想要在Windows系统上搭建专业级流媒体服务器&#xff1f;虽然SRS Windows版本已不再维护&#xff0c;但本文…...