当前位置: 首页 > 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…...

Python爬虫实战:研究MechanicalSoup库相关技术

一、MechanicalSoup 库概述 1.1 库简介 MechanicalSoup 是一个 Python 库,专为自动化交互网站而设计。它结合了 requests 的 HTTP 请求能力和 BeautifulSoup 的 HTML 解析能力,提供了直观的 API,让我们可以像人类用户一样浏览网页、填写表单和提交请求。 1.2 主要功能特点…...

AI-调查研究-01-正念冥想有用吗?对健康的影响及科学指南

点一下关注吧&#xff01;&#xff01;&#xff01;非常感谢&#xff01;&#xff01;持续更新&#xff01;&#xff01;&#xff01; &#x1f680; AI篇持续更新中&#xff01;&#xff08;长期更新&#xff09; 目前2025年06月05日更新到&#xff1a; AI炼丹日志-28 - Aud…...

web vue 项目 Docker化部署

Web 项目 Docker 化部署详细教程 目录 Web 项目 Docker 化部署概述Dockerfile 详解 构建阶段生产阶段 构建和运行 Docker 镜像 1. Web 项目 Docker 化部署概述 Docker 化部署的主要步骤分为以下几个阶段&#xff1a; 构建阶段&#xff08;Build Stage&#xff09;&#xff1a…...

突破不可导策略的训练难题:零阶优化与强化学习的深度嵌合

强化学习&#xff08;Reinforcement Learning, RL&#xff09;是工业领域智能控制的重要方法。它的基本原理是将最优控制问题建模为马尔可夫决策过程&#xff0c;然后使用强化学习的Actor-Critic机制&#xff08;中文译作“知行互动”机制&#xff09;&#xff0c;逐步迭代求解…...

渲染学进阶内容——模型

最近在写模组的时候发现渲染器里面离不开模型的定义,在渲染的第二篇文章中简单的讲解了一下关于模型部分的内容,其实不管是方块还是方块实体,都离不开模型的内容 🧱 一、CubeListBuilder 功能解析 CubeListBuilder 是 Minecraft Java 版模型系统的核心构建器,用于动态创…...

linux 下常用变更-8

1、删除普通用户 查询用户初始UID和GIDls -l /home/ ###家目录中查看UID cat /etc/group ###此文件查看GID删除用户1.编辑文件 /etc/passwd 找到对应的行&#xff0c;YW343:x:0:0::/home/YW343:/bin/bash 2.将标红的位置修改为用户对应初始UID和GID&#xff1a; YW3…...

华为云Flexus+DeepSeek征文|DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建

华为云FlexusDeepSeek征文&#xff5c;DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建 前言 如今大模型其性能出色&#xff0c;华为云 ModelArts Studio_MaaS大模型即服务平台华为云内置了大模型&#xff0c;能助力我们轻松驾驭 DeepSeek-V3/R1&#xff0c;本文中将分享如何…...

全志A40i android7.1 调试信息打印串口由uart0改为uart3

一&#xff0c;概述 1. 目的 将调试信息打印串口由uart0改为uart3。 2. 版本信息 Uboot版本&#xff1a;2014.07&#xff1b; Kernel版本&#xff1a;Linux-3.10&#xff1b; 二&#xff0c;Uboot 1. sys_config.fex改动 使能uart3(TX:PH00 RX:PH01)&#xff0c;并让boo…...

AspectJ 在 Android 中的完整使用指南

一、环境配置&#xff08;Gradle 7.0 适配&#xff09; 1. 项目级 build.gradle // 注意&#xff1a;沪江插件已停更&#xff0c;推荐官方兼容方案 buildscript {dependencies {classpath org.aspectj:aspectjtools:1.9.9.1 // AspectJ 工具} } 2. 模块级 build.gradle plu…...

【VLNs篇】07:NavRL—在动态环境中学习安全飞行

项目内容论文标题NavRL: 在动态环境中学习安全飞行 (NavRL: Learning Safe Flight in Dynamic Environments)核心问题解决无人机在包含静态和动态障碍物的复杂环境中进行安全、高效自主导航的挑战&#xff0c;克服传统方法和现有强化学习方法的局限性。核心算法基于近端策略优化…...