vue 2.0 及 vue 3.0 rem配置
vue 2.0 配置 rem
首先先安装postcss-px2rem (百度可以) https://www.jianshu.com/p/e6476bbc2131
npm install postcss-px2rem
找到文件 build / vue-loader.config.js 添加
const px2rem = require('postcss-px2rem')
postcss: function() {
return [px2rem({remUnit: 75})];
}

在index.html 文件中配置
<script>
document.getElementsByTagName('html')[0].style.fontSize = (document.documentElement.clientWidth || document.body
.clientWidth) / 10 + 'px';
window.addEventListener("resize", () => {
document.getElementsByTagName('html')[0].style.fontSize = (document.documentElement.clientWidth || document
.body.clientWidth) / 10 + 'px';
});
</script>

vue 3.0 配置 rem (百度可以)
这位大佬 的 https://www.jianshu.com/p/94902796f2ad
vue 2.0 及 vue 3.0 rem配置的更多相关文章
- 简单vue项目脚手架(vue+webpack2.0+vuex+vue-router)
github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-router(^2.5.3 ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十七 ║Vue基础:使用Vue.js 来画博客首页+指令(一)
缘起 书说前两篇文章<十五 ║ Vue前篇:JS对象&字面量&this>和 <十六 ║ Vue前篇:ES6初体验 & 模块化编程>,已经通过对js面向对 ...
- vue的生命周期(又称钩子函数)----以及vue1.0版本与vue2.0版本生命周期的不同
vue生命周期 1. vue1.0版本与vue2.0版本生命周期的不同 vue1.0版本生命周期图示 图1 vue1.0版本生命周期 vue1.0版本的生命周期: init 实例创建之前 creat ...
- vue2.0 vs vue
vue2.0相比vue1.0 有哪些改变,今天总结了一下 vue2.0组件中 template 不在支持代码片段 //vue1.0组件中template写法 <template> < ...
- Vue2.0总结———vue使用过程常见的一些问题
Vue目前的的开发模式主要有两种:1.直接页面级的开发,script直接引入Vue2.工程性开发,webpack+loader或者直接使用脚手架工具Vue-cli,里面的文件都配置好了 webpack ...
- 使用vue 3.0 初始化vue脚手架
vue-cli3.0安装 如果你事先已经全局安装了旧版本的vue-cli(1.x 或 2.x),你需要先卸载它: npm uninstall vue-cli -g 安装 npm install -g ...
- webpack4.0 ---引用vue文件
一.引入Vue 1.安装依赖环境 npm i vue-loader -D;//解析转化.vue文件,npm i vue-style-loader -D npm i vue-template-compi ...
- Vue 2.0 与 Vue 3.0 响应式原理比较
Vue 2.0 的响应式是基于Object.defineProperty实现的 当你把一个普通的 JavaScript 对象传入 Vue 实例作为 data 选项,Vue 将遍历此对象所有的 prop ...
- Vue2.0 搭建Vue脚手架(vue-cli)
介绍 Vue.js是一套构建用户界面的渐进式框架.Vue 只关注视图层,采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 阅读之前需要了解的知 ...
- vue2.0搭建vue手脚架(vue-cli)
1.安装node.js 从node官网下载并安装node,安装步骤很简单,只要一路“next”就可以了.安装完成后,打开命令行工具输入命令node -v,如下图,如果出现对应版本号,就说明安装成功了. ...
随机推荐
- Dart面向对象编程(二)
继承: person.dart: class Person{ String name; int age; String _birthday; bool get isAdult => age &g ...
- lua中,两种json和table互转方法的效率比较
lua中json和table的互转,是我们在平时开发过程中经常用到的.比如: 在用lua编写的服务器中,如果客户端发送json格式的数据,那么在lua处理业务逻辑的时候,必然需要转换成lua自己的数据 ...
- Java : JavaWeb和Tomcat相关
部署:1.直接把项目移动到webapps文件夹下, 用文件夹名访问(如果ROOT文件夹可以直接访问)2.也可以把war包放到webapps文件夹下, tomcat自动解压,但是删除war包必须要停止t ...
- [4]Hexo静态博客背景及界面显示优化配置
示例预览:我的主页 前提预设: [3]hexo+github搭建个人博客的主题配置 [2]hexo+github搭建个人博客的简单使用 [1]hexo+github搭建个人博客的过程记录 背景图片添加 ...
- 图解微信小程序---调用API操作步骤
图解微信小程序---调用API操作步骤 什么是API API(Application Programming Interface,应用程序编程接口:是一些预先定义的函数,目的是提供应用程序与开发人员基 ...
- 插件油泼猴+脚本 for chrome 安装 - https://greasyfork.org/zh-CN
http://chromecj.com/utilities/2018-09/1525.html 一.将 *.crx 改名为 *.zip 二.访问 chrome://flags/#extensions- ...
- sklearn聚类评价指标
sklearn中的指标都在sklearn.metric包下,与聚类相关的指标都在sklearn.metric.cluster包下,聚类相关的指标分为两类:有监督指标和无监督指标,这两类指标分别在skl ...
- C# abstract class Interface的介绍
1.基本概念介绍 抽象类: 1.抽象方法只作声明,而不包含实现,可以看成是没有实现体的虚方法 2.抽象类可以但不是必须有抽象属性和抽象方法,但是一旦有了抽象方法,就一定要把这个类声明为抽象类 3.具体 ...
- ETL中获取公共时间参数变量释义
- nginx 安装第三方模块(lua)并热升级
需求: nginx上将特定请求拒绝,并返回特定值. 解决办法: 使用lua脚本,实现效果. 操作步骤: 安装Luajit环境 重新编译nginx(目标机器上nginx -V 配置一致,并新增两个模块n ...