vite4项目中,vant兼容750适配

一般非vite项目,使用postcss-px-to-viewport。在设计稿为750时候,可使用以下配置兼容vant。
在这里插入图片描述
在vite4项目中,以上配置不行。需要调整下,使用postcss-px-to-viewport-8-plugin,并修改viewportWidth,具体如下:

module.exports = (file) => {
  // console.log(" exports--------  ",file)
  return {
    plugins: {
      autoprefixer: {},
      "postcss-px-to-viewport-8-plugin": {
        viewportWidth:function (file) {
        //注意,"node_modules/vant"是windows下的路径。 
        //你可以打印下 file查看自己电脑上的vant路径是什么格式
          return file && file.includes("node_modules/vant") ? 375 : 750;
        },
        unitToConvert: "px",
        // viewportWidth: 750,
        unitPrecision: 6,
        propList: ["*"],
        viewportUnit: "vw",
        fontViewportUnit: "vw",
        selectorBlackList: [],
        minPixelValue: 1,
        mediaQuery: true,
        landscape: false
      }
    }
  }

}

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

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

相关文章

51单片机定时/计数器相关知识点

51单片机定时/计数器相关知识点 结构组成 51单片机的定时/计数器中有两个寄存器: T0:低位:TL0(字节地址8AH)高位:TH0(字节地址8CH)T1:低位:TL1&#xff08…

走向云原生 破局数字化

近年来,随着云计算概念和技术的普及,云原生一词也越来越热门,云原生成为云计算领域的新变量。行业内,华为、阿里巴巴、字节跳动等各个大厂都在“抢滩”云原生市场。行业外,云原生也逐渐出圈,出现在大众视野…

Visual Studio Code安装C#开发工具包并编写ASP.NET Core Web应用

前言 前段时间微软发布了适用于VS Code的C#开发工具包(注意目前该包还属于预发布状态但是可以正常使用),因为之前看过网上的一些使用VS Code搭建.NET Core环境的教程看着还挺复杂的就一直没有尝试使用VS Code来编写.NET Core。不过听说C# 开发…

设计模式Java实战,彻底学会

​这是全网最强的Java设计模式实战教程。此教程用实际项目场景,结合SpringBoot,让你真正掌握设计模式。 网址是:Java设计模式实战专栏介绍 - 自学精灵(也可以百度搜索“自学精灵”)。 本设计模式专栏的威力 用Java实…

MySQL学习笔记2: MySQL的前置知识

目录 1. MySQL是什么?2. 什么是客户端,什么是服务器?3. 服务器的特点4. 安装mysql5. mysql 客户端6. mysql 服务器7. mysql的本体8. MySQL 使用什么来存储数据?9. 数据库的多种含义10. MySQL 存储数据的组织方式 1. MySQL是什么? MySQL 是…

算法每日一题: 被列覆盖的最多行数 | 二进制 - 状态压缩

大家好,我是星恒 今天的题目又是一道有关二进制的题目,有我们之前做的那道 参加考试的最大学生数的 感觉,哈哈,当然,比那道题简单多了,这道题感觉主要的考点就是二进制,大家可以好好总结一下这道…

使用 Maven 的 dependencyManagement 管理项目依赖项

使用 Maven 的 dependencyManagement 管理项目依赖项 介绍 在开发 Java 项目时&#xff0c;管理和协调依赖项的版本号是一项重要而繁琐的任务。 而 Maven 提供了 <dependencyManagement> 元素&#xff0c;用于定义项目中所有依赖项的版本。它允许您指定项目中每个依赖…

Java网络编程 、UDP、TCP、Socket通信

这个是第一篇&#xff0c;我先写udp&#xff0c; 首先我解释一下这个的特点是什么&#xff0c;他的特点主要是&#xff1a; 我发送消息之后就不管这个消息的任何情况&#xff0c;也就是&#xff0c;我只要把这个消息发送出去就不管了 这个是大白话的解释&#xff0c;具体的就…

el 消除inpu输入框内容和下拉内容

输入这个就好了,clearable @clear="getList()" 非常简单 <span class="type-box"><span class="label">订单状态</span><el-select v-model="params.orderStatus" placeholder="请选择" class=&…

openGauss学习笔记-188 openGauss 数据库运维-常见故障定位案例-core问题定位

文章目录 openGauss学习笔记-188 openGauss 数据库运维-常见故障定位案例-core问题定位188.1 磁盘满故障引起的core问题188.1.1 问题现象188.1.2 原因分析188.1.3 处理办法 188.2 GUC参数log_directory设置不正确引起的core问题188.2.1 问题现象188.2.2 原因分析188.2.3 处理办…

html js加载本地文件报错处理,跨域问题

这个问题是怎么来的&#xff1f;我写了一个本地html文件&#xff0c;里面通过three.js加载并显示一个本地三维模型&#xff0c;结果报错了。 报错如下&#xff1a; Access to XMLHttpRequest at file:///C:/model/quater.mtl from origin null has been blocked by CORS poli…

GUI设计基础

层次结构 要学GUI&#xff0c;大概先知道它的层次结构&#xff0c;如下图所示&#xff0c;我们要设计的就是下面这个几个东西。 菜单uimenu 建立一级菜单项的函数调用格式&#xff1a; hmuimenu(h_parent,PropertyNamel,valuel,propertyName2,value2&#xff0c;...); hm 是…

云原生十二问

一、什么是云原生&#xff1f; 云原生是在云计算环境中构建、部署和管理现代应用程序的软件方法。现代企业希望构建高度可扩展、灵活且具有弹性的应用程序&#xff0c;可以快速更新以满足客户需求。为此&#xff0c;他们使用现代工具和技术&#xff0c;这些工具和技术本质上支…

从零开始的OpenGL光栅化渲染器构建1

前言 参照Learnopengl&#xff0c;我开始回顾OpenGL中的内容&#xff0c;最终目标是构建一个玩具级的光栅化渲染器&#xff0c;最好还能和之前做的光线追踪渲染器相结合&#xff0c;希望能够有所收获吧~ 包管理 之前我用CMake配置过OpenGL的环境&#xff0c;这样做出来的项目…

【Java EE初阶六】多线程案例(单例模式)

1. 单例模式 单例模式是一种设计模式&#xff0c;设计模式是我们必须要掌握的一个技能&#xff1b; 1.1 关于框架和设计模式 设计模式是软性的规定&#xff0c;且框架是硬性的规定&#xff0c;这些都是技术大佬已经设计好的&#xff1b; 一般来说设计模式有很多种&#xff0c;…

抖音字幕视频怎么做能滚动 抖音个性字幕怎么做 抖音短视频用什么软件剪辑

不管是抖音短视频&#xff0c;还是其他影视网站的影视剧&#xff0c;字幕基本都是必不可少的&#xff0c;字幕本身就能加强观众对视频的理解&#xff0c;而且像一些滚动字幕&#xff0c;会更加吸引观众的注意力&#xff0c;那抖音字幕视频怎么做能滚动&#xff1f;抖音个性字幕…

Hierarchical Clusting模型

介绍&#xff1a; Hierarchical Clustering 是一种常用的聚类方法&#xff0c;它通过构建一个层次化的聚类树&#xff08;或者称为聚类图&#xff09;&#xff0c;将数据点逐步合并组成不同的聚类簇。 Hierarchical Clustering 的主要思想是将相似的数据点归为一类&#xff0c…

动态规划(不同路径1,不同路径2,整数拆分)

62.不同路径 力扣题目链接(opens new window) 一个机器人位于一个 m x n 网格的左上角 &#xff08;起始点在下图中标记为 “Start” &#xff09;。 机器人每次只能向下或者向右移动一步。机器人试图达到网格的右下角&#xff08;在下图中标记为 “Finish” &#xff09;。…

有什么安全处理方案可以有效防护恶意爬虫

常见的爬虫 有百度爬虫、谷歌爬虫、必应爬虫等搜索引擎类爬虫&#xff0c;此类爬虫经常被企业用于提高站点在搜索引擎内的自然排名&#xff0c;使得站点在各大搜索引擎中的排名能够提高&#xff0c;进一步通过搜索引擎来进行引流为企业增加业务流量。 恶意爬虫与合法、合规的搜…

资源类的使用(MFC)

文章目录 1.预备知识1.菜单1.创建菜单在系统自动生成的菜单资源中添加一个主菜单命令菜单属性 2.编辑菜单过程中所涉及的操作3.菜单设计步骤4.菜单的响应和消息路由5.CMenu类获取菜单指针添加菜单项删除菜单项获取菜单项数目获取菜单ID号对菜单项属性的修改显示快捷菜单 2.工具…