1、首先在项目中安装以下依赖

npm install px2rem-loader --save
npm install amfe-flexible --save
npm install postcss-px2rem --save
2、在main.js中添加:

import 'amfe-flexible'
3、在vue.config.js中进行配置

module.exports = {
css: {
loaderOptions: {
postcss: {
plugins: [
require('postcss-px2rem')({remUnit: 37.5}),
]
}
}
},
}
————————————————
版权声明:本文为CSDN博主「Anne的前端之路」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/qq_31403519/article/details/104299997

cli4适配移动端的更多相关文章

  1. 让 jQuery UI draggable 适配移动端

    背景: 在移动端,本人要实现对某个元素的拖动,想到使用 jQuery UI 的 draggable 功能.但是发现此插件的拖动只支持PC端,不支持移动端. 原因: 原始的 jQuery UI 里,都是 ...

  2. bootstrap适配移动端

    上次在pythonanywhere上挂上去的页面,是这个样子的 而在手机上看是这个样子的 总之简直不能看= = 看了一下学校几个微信公众号的页面.都是用的bootstrap,好吧我也去试试看好了. 在 ...

  3. Vue将px转化为rem适配移动端

    Vue将px转化为rem适配移动端 1.下载lib-flexible我使用的是vue-cli+webpack,所以是通过npm来安装的npm i lib-flexible --save 2.引入lib ...

  4. React.js 入门与实战之开发适配PC端及移动端新闻头条平台课程上线了

    原文发表于我的技术博客 我在慕课网的「React.js 入门与实战之开发适配PC端及移动端新闻头条平台」课程已经上线了,文章中是目前整个课程的大纲,以后此课程还会保持持续更新,此大纲文档也会保持更新, ...

  5. 从0到1构建适配不同端(微信小程序、H5、React-Native 等)的taro + dva应用

    从0到1构建适配不同端(微信小程序.H5.React-Native 等)的taro + dva应用 写在前面 Taro 是一套遵循 React 语法规范的 多端开发 解决方案.现如今市面上端的形态多种 ...

  6. 本周汇总 动态rem适配移动端/块状元素居中/透明度

    1.动态rem适配移动端 !function(){ var width = document.documentElement.clientWidth; var head=document.getEle ...

  7. 九、响应式发:rem和less(适配移动端)

    一.响应式开发 响应式开发优先适配移动端又兼容到pc端 官网:https://less.bootcss.com/usage/ 教程:https://www.w3cschool.cn/less/ rem ...

  8. 使用viewport中的vm来适配移动端页面

    前言 作为一个小前端,经常要和H5打交道,这就面临着不同终端的适配问题. Flexible方案通过Hack手段来根据设备的dpr值相应改变<meta>标签中viewport的值,给我更贴切 ...

  9. vue中使用vw适配移动端

    推荐看看大漠老师的文章,非常的有收获 如何在Vue项目中使用vw实现移动端适配 1.首先在项目中安装依赖 npm i postcss-aspect-ratio-mini postcss-px-to-v ...

随机推荐

  1. 杭电-------2042不容易系列之二(C语言写)

    /* 根据题意,知道了最终只剩下了3只羊,应该是从最后一步向前推算,但是因为题意的测试布置一个 可以从只有一个收费站算起,知道本次需要就算的收费站,这样之后有小于此数目的可以直接输出, 大于此数目的也 ...

  2. 大数四则运算之减法运算-----c语言版

    /* 分三种情况: 1.减数长度大于被减数 交换减数与被减数,输出负号,方便减 2.减数长度等于被减数(分三种情况) a.减数大于被减数,类似1情况1 b.减数等于被减数,两数相等,直接输出0,完成. ...

  3. 珠峰-express

    ##### #### 中间件的作用 #### 自己写的Route方法 #### #### 中间件

  4. vue插件介绍

    1.插件和组件的关系 在没有封装组件之前,如果不使用第三方插件,那么很多情况下我们会编写几个常用的组件来提供给页面使用,如Alert/Loading组件,而你可能需要在很多页面中引入并且通过compo ...

  5. transition 过渡的兼容性处理

    transition兼容性: 封装一个js来验证浏览器是否兼容transition,以及选择兼容的写法 以下是transition.js (function(){ //判断transition属性是否 ...

  6. 网页延迟加载动画的实现-WOW.js

    网页内容一开始不显示,随着鼠标下拉延迟显示,还有时间差 一开始觉得好难好复杂好高大上,直到我发现 wow.js …… 首先是演示地址:https://www.delac.io/wow/ 嗯,狗子确实很 ...

  7. JavaScript之BOM基础

    BOM(Browser Object Model)也叫浏览器对象,它提供了很多对象,用于访问浏览器的功能.但是BOM是没有标准的,每一个浏览器厂家会根据自己的需求来扩展BOM对象.本文主要以一些简单的 ...

  8. redis 5.0.7 源码阅读——跳跃表skiplist

    redis中并没有专门给跳跃表两个文件.在5.0.7的版本中,结构体的声明与定义.接口的声明在server.h中,接口的定义在t_zset.c中,所有开头为zsl的函数. 一.数据结构 单个节点: t ...

  9. yum 程序包管理简介

    rpm可以实现程序的快速,简单安装(跟编译安装比),但是rpm自己不能解决依赖,所以很多工具为了自动解决依赖应运而生,其中yum就是其中之一. yum解决依赖的办法: 必须有个文件服务器,里面放置所以 ...

  10. std::sort为什么保证严格弱序?

    这个问题是面试腾讯光子的时候面试官提的,当时的问题是:sort自定义comp函数能用>=吗?当时的我想comp函数只要函数签名是对的应该就没问题吧,于是答了可以.面试结束后总感觉哪里不对,耿耿于 ...