总结用vue+vue-cli+淘宝lib-flexible做移动端自适应方案:

1.安装淘宝lib-flexible

npm install lib-flexible --save

2.在入口文价main.js中引用flexible

import 'lib-flexible'
3.由于在开发中rem和px手动转换比较麻烦,所以建议安装px2rem这个工具
3.1安装px2rem工具
npm install px2rem-loader --save-dev
3.2在vue-cli生成的文件中,找到以下文件 build/utils.js,如下图添加3处配置

重启下服务,就可以使用px作为设计稿(750px)给的单位使用啦,项目打包后px会自动转换为rem。

vue+vue-cli+淘宝lib-flexible做移动端自适应的更多相关文章

  1. Vue实现仿淘宝商品详情属性选择的功能

    Vue实现仿淘宝商品详情属性选择的功能 先看下效果图:(同个属性内部单选,属性与属性之间可以多选) 主要实现过程: 所使用到的数据类型是(一个大数组里面嵌套了另一个数组)具体格式如下:   attrA ...

  2. 有了这套flexible.js 移动端自适应方案,你就能在移动端的来去自如, (*^__^*)

    flexible.js 移动端自适应方案 一,flexible.js 的使用方式: github地址:https://github.com/amfe/lib-flexible 官方文档地址:https ...

  3. vue实现仿淘宝结账页面

    这个demo,是小颖基于之前的 vue2.0在table中实现全选和反选   文章进行更新后的demo,主要功能呢,是仿照淘宝页面的结算购物车商品时自动算出合计价格的页面,具体页面效果请看下面的动图: ...

  4. vue实现结算淘宝购物车效果

    实现单选时的价格,全选时价格 单选效果图 全选效果图 html <template> <!-- 淘宝结算购物车 --> <div class="settleme ...

  5. flexible.js 移动端自适应方案

    一,flexible.js 的使用方式: github地址:https://github.com/amfe/lib-flexible 官方文档地址:https://github.com/amfe/ar ...

  6. 淘宝适配 flexible.js

    1.引入 阿里cdm文件,也可以自己下载下来引用,不需要在添加<meta name="viewport"">标签了 <script src=" ...

  7. (转)从P1到P7——我在淘宝这7年

    (一) 2011-12-08 [原文链接] 今天有同事恭喜我,我才知道自己在淘宝已经七周年了.很多人第一句话就是七年痒不痒,老实说,也曾经痒过,但往往都是一痒而过,又投入到水深火热的工作中去.回家之后 ...

  8. 淘宝杨志丰:OceanBase--淘宝结构化大数据解决之道

    时至今日,“Big data”(大数据)时代的来临已经毋庸置疑,尤其是在电信.金融等行业,几乎已经到了“数据就是业务本身”的地步.这种趋势已经让很多相信数据之力量的企业做出改变.恰逢此时,为了让更多的 ...

  9. 从P1到P7——我在淘宝这7年(转)

    作者: 赵超  发布时间: 2012-02-25 14:47  阅读: 114607 次  推荐: 153   [收藏] (一) 2011-12-08 [原文链接] 今天有同事恭喜我,我才知道自己在淘 ...

随机推荐

  1. Angular4 websocket通讯

  2. polyfillJS生成promise对象

    https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.min.js

  3. (Review cs231n) Object Detection

    目标:我们有几个类别,然后我们要在这张图中找到这些类的所有实例 解决思路:是否可以按照回归的思路进行求解呢? 但是受限制于确定的种类输出问题. 方法:分类和回归是解决问题的两个套路,我们现在对于目标的 ...

  4. 中文编码错误,Error output could not be translated from the native locale to UTF-8.

    假如使用http访问仓库,用户配置的pre-commit钩子里面如果有中文,可能会出现"Error output could not be translated from the nativ ...

  5. Node.js 搭建 https 协议 服务器

    var https = require('https'); //创建服务器 https var fs = require('fs'); //文件系统的模块 const hostname = '127. ...

  6. IP通信基础学习第四周(上)

    IP地址现在由因特网名字与号码指派公司ICANN进行分配,它是标志一个主机(或路由器)和一条链路的接口,其编址方法有:分类的IP地址.子网的划分.构成超网. 分类两级IP地址可以记为:IP::={&l ...

  7. ss命令详解

    ss是Socket Statistics的缩写.顾名思义,ss命令可以用来获取socket统计信息,它可以显示和netstat类似的内容.ss的优势在于它能够显示更多更详细的有关TCP和连接状态的信息 ...

  8. opencv学习之路(32)、角点检测

    一.角点检测的相关概念 二.Harris角点检测——cornerHarris() 参考网址: http://www.cnblogs.com/ronny/p/4009425.html #include ...

  9. js 控制 class 类名(classList) 和 自定义属性(dataset)

    classList 用法: const div = document.querySelector('div') div.classList.add('myclass') // 添加类名 div.cla ...

  10. GitLab本地、远程更新已经fork的项目

    单用IDEA无法做到,必须配合使用Git命令行才能做到,而且是先从原作者项目更新本地库,再从本地库push到自己远程fork项目,非常坑逼. 1.到项目clone的根目录右键Git Bash,先查看远 ...