您的位置：首页 > 编程技术 > js  >  react配置px转换rem的方法

react配置px转换rem的方法

 更新时间：2021年4月30日 15:01  点击：2218

安装相关的依赖

npm i lib-flexible --save
npm i postcss-px2rem --save

主要用来暴露项目配置

npm run eject
！如果运行npm run eject报错，出错的原因应该是仓库里面代码没有提交，如下提交一下
git add .
git commit -m '自定义名'
npm run eject

然后打开项目中 config->webpack.config.js 进行配置

// 在配置文件中添加如下两行代码
// px2rem({ remUnit: 75 }) 的意思就是1rem = 75px 这个是根据750px设计稿来的，如果是620 的就写 62

const px2rem = require('postcss-px2rem');
px2rem({ remUnit: 75 })

按照设计图大小设置 如：108=1080px/10

引入 lib-flexible：在入口文件index.js中引入lib-flexible文件

import 'lib-flexible'

在 public->index.html 文件里把下面的这段代码注释掉

配置完成之后 重启项目

到此这篇关于react配置px转换rem的方法的文章就介绍到这了,更多相关react配置px转换rem内容请搜索猪先飞以前的文章或继续浏览下面的相关文章希望大家以后多多支持猪先飞！

[!--infotagslink--]

相关文章

  • 使用PHP+JavaScript将HTML页面转换为图片的实例分享

    这篇文章主要介绍了使用PHP+JavaScript将HTML元素转换为图片的实例分享,文后结果的截图只能体现出替换的字体,也不能说将静态页面转为图片可以加快加载,只是这种做法比较interesting XD需要的朋友可以参考下...2016-04-19

  • 在数据库里将毫秒转换成date格式的方法

    在开发过程中，我们经常会将日期时间的毫秒数存放到数据库，但是它对应的时间看起来就十分不方便，我们可以使用一些函数将毫秒转换成date格式。 一、 在MySQL中，有内置的函数from_unixtime()来做相应的转换，使用如下： 复制...2014-05-31

  • Javascript类型转换的规则实例解析

    这篇文章主要介绍了Javascript类型转换的规则实例解析，涉及到javascript类型转换相关知识，对本文感兴趣的朋友一起学习吧...2016-02-27

  • 美图秀秀把普通照片快速转换成卡通效果教程

    今天小编在这里就来给美图秀秀的这一款软件的使用者们来说下把普通照片快速转换成卡通效果的教程，各位想知道具体制作步骤的使用者们，那么下面就快阿里跟着小编一起看一...2016-09-14

  • 关于React Native报Cannot initialize a parameter of type'NSArray＜id＜RCTBridgeModule＞＞错误(解决方案)

    这篇文章主要介绍了关于React Native报Cannot initialize a parameter of type'NSArray＜id＜RCTBridgeModule＞＞错误，本文给大家分享解决方案,需要的朋友可以参考下...2021-05-12

  • React使用高德地图的实现示例(react-amap)

    这篇文章主要介绍了React使用高德地图的实现示例(react-amap)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧...2021-04-18

  • React引入antd-mobile+postcss搭建移动端

    本文给大家分享React引入antd-mobile+postcss搭建移动端的详细流程，文末给大家分享我的一些经验记录使用antd-mobile时发现我之前配置的postcss失效了，防止大家踩坑，特此把解决方案分享到脚本之家平台，需要的朋友参考下吧...2021-06-21

  • 浅析C#数据类型转换的几种形式

    本篇文章是对C#中数据类型转换的几种形式进行了详细的分析介绍，需要的朋友参考下...2020-06-25

  • JavaScript实现数据类型的相互转换

    这篇文章主要为大家详细介绍了JavaScript实现数据类型的相互转换，感兴趣的朋友可以参考一下...2016-03-09

  • JavaScript实现Base64编码转换

    这篇文章主要介绍了JavaScript实现Base64编码转换的相关资料,非常简单实用，需要的朋友可以参考下...2016-04-25

  • PHP编码转换函数mb_convert_encoding与iconv用法

    文章来实现一个PHP编码转换函数mb_convert_encoding与iconv用法，希望例子能帮助到各位。 将一个短信接口代码从apache迁移到nginx+php-fpm后，发现无法发出短信了，查...2016-11-25

  • c#入门之类型转换详解

    这篇文章主要介绍了c#的类型转换详解，类型转换分两种形式：隐式转换、显示转换,下面是详细介绍...2020-06-25

  • 使用 React 和 Threejs 创建一个VR全景项目的过程详解

    这篇文章主要介绍了使用 React 和 Threejs 创建一个VR全景项目的过程详解,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下...2021-04-06

  • C#将数字转换成字节数组的方法

    这篇文章主要介绍了C#将数字转换成字节数组的方法,涉及C#字符串操作的技巧,非常具有实用价值,需要的朋友可以参考下...2020-06-25

  • vue+rem自定义轮播图效果

    这篇文章主要为大家详细介绍了vue+rem自定义轮播图效果，手指触摸左滑和右滑，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2021-06-29

  • vue如何使用rem适配

    这篇文章主要介绍了vue如何使用rem适配，帮助大家处理vue开发移动应用时的兼容性问题，感兴趣的朋友可以了解下...2021-02-06

  • java中JSONObject转换为HashMap(方法+main方法调用实例)

    这篇文章主要介绍了java中JSONObject转换为HashMap(方法+main方法调用实例)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧...2020-11-14

  • React+高德地图实时获取经纬度,定位地址

    思路其实没有那么复杂，把地图想成一个盒子容器，地图中心点想成盒子中心点；扎点在【地图中心点】不会动，当移动地图时，去获取【地图中心点】经纬度，设置某个位置的时候，将经纬度设置为【地图中心点】即可...2021-06-20

  • JSON字符串转换JSONObject和JSONArray的方法

    这篇文章主要介绍了JSON字符串转换JSONObject和JSONArray的方法的相关资料,需要的朋友可以参考下...2016-06-12

  • php中iconv编码转换来解决中文乱码的问题

    用到iconv函数把抓取来过的utf-8编码的页面转成gb2312， 发现只有用iconv函数把抓取过来的数据一转码数据就会无缘无故的少一些 代码如下 复制代码 ...2016-11-25