总结用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. netsh禁用启用本地连接

    netsh interface set interface mi8 disablednetsh interface set interface mi8 enabled mi8是本地连接名称,需要管理员 ...

  2. JQuery选择器,动画,事件和DOM操作

    JQuery是由JS封装的一些方法,供我们调用,可以快速的实现某些JS功能,实际是JS编写的方法包 将JQuery文件放到JS文件夹下,然后引用到<head></head>中 ...

  3. Winfon 页签切换及窗体控件自适应

    由于公司的业务调整,最近不仅开发bs,还有不熟悉的cs,人手也不足,项目还多,对于cs来说,算是小白,虽然是一个人,也是硬着头皮写,拖拽控件,自定义控件.一个项目下来,对cs有了很深的认识,这里好好感 ...

  4. Nginx 修改用户权限

    [1]Nginx 修改用户权限 (1)修改前:Nginx系统默认用户权限是nobody 查看可知: (2)修改方法 欲使用root权限启动的. 修改 /usr/local/nginx/conf/ 下n ...

  5. 无法加载协定为“NM3.IClrService”的终结点配置部分,因为找到了该协定的多个终结点配置。请按名称指示首选的终结点配置部分

    <binding name="NetTcpBinding_IClrService1" receiveTimeout="00:10:00" sendTime ...

  6. 20175208 张家华 MyCP

    一.内容 编写MyCP.java 实现类似Linux下cp XXX1 XXX2的功能,要求MyCP支持两个参数: java MyCP -tx XXX1.txt XXX2.bin 用来把文本文件(内容为 ...

  7. ODI基于源表时间戳字段获取增量数据

    实现目标:通过ODI获取一个没有时间戳的子表(qb_bw)的增量数据,而主表(qb_tb)有一个rksj入库时间,且主表和子表之间通过ID关联.目标表名是qb_bw1. 设计原理:通过在ODI的map ...

  8. springboot+thymeleaf+pageHelper带条件分页查询

    html层 <div> <a class="num"><b th:text="'共 '+ ${result.resultMap['pages ...

  9. 58 字体反爬攻略 python3

    1.下载安装包 pip install fontTools 2.下载查看工具FontCreator 百度后一路傻瓜式安装即可 3.反爬虫机制 网页上看见的 后台源代码里面的 从上面可以看出,生这个字变 ...

  10. 程序员 面试题【前端,java,php】

    跬步客 网址:https://www.kuibuke.com/wall/index