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. WannaMine4.0查杀方法

    病毒现象 扫描爆破内网基于445端口的SMB服务 服务器出现卡顿.蓝屏 服务器主动访问恶意域名:totonm.com.cake.pilutce.com:443 病毒处置 删除关键病毒文件:C:\Win ...

  2. 新手必看:PyCharm安装教程,Python开发者的有力工具

    PyCharm是由JetBrains打造的一款Python IDE,VS2010的重构插件Resharper就是出自JetBrains之手. 同时支持Google App Engine,PyCharm ...

  3. scanf函数中*修饰符的作用,如:%*d

    在scanf函数中,*修饰符可以跳过所在项的输入.如下: #include <stdio.h> int main() { ; printf("请输入:"); scanf ...

  4. wow.js wow.min.js animate.css animate.min.css

    奉献给下载不到源码的小伙伴,下载到的请忽视 wow.js (function() { var MutationObserver, Util, WeakMap, getComputedStyle, ge ...

  5. CSS中元素的显示模式

     在CSS中,根据元素显示模式的不同元素标签被分为了两类:行内元素(inline-level).块级元素(block-level). 1,首先介绍什么是行内元素,什么又是块级元素? 1.1,行内元素就 ...

  6. ES6 - 报错整理(1): Unexpected end of JSON input while parsing near '...es":"7.0.0-alpha.11",'

    npm install --save-dev 安装 babel-preset-env时一直报错 Unexpected end of JSON input while parsing near '... ...

  7. PMP--1.3 项目环境

    项目所处的环境可能对项目的开展产生有利或不利的影响.影响项目的环境因素==项目经理在项目期间需要考虑的因素.这些因素不需要死记硬背,需要有一定了解就可以,在项目开始前针对文中内容提前把环境了解清楚,并 ...

  8. Elasticsearch之增加和删除索引

    增加索引 利用postMan工具发送restfulAPI添加索引库 请求方式为put代表添加 创建索引index时映射mapping 请求URL: 使用put发送http://localhost:92 ...

  9. 通过Java代码获取系统信息

    在开发中,我们需要获取JVM中的信息,以及操作系统信息,内存信息,CPU信息,磁盘信息,网络信息等,通过Java的API不能获取内存等信息,需要sigar的第三方依赖包. ①:加入依赖 <dep ...

  10. mac 15 IDA7.0 下载安装

    吾爱破解上有相应的解决办法,在低版本mac上安装完成后,直接拖到15版本,再打上补丁,补丁可以自己去找,下面是转好了的,mac解压最好不要用自带的解压软件,用BetterZip试试,不行就多解压几次, ...