ie6-8 avalon2 单页应用项目实战备忘
坑爹的ie,作为小组leader,尼玛,小伙伴儿们不乐意做的事情,我来做好了。。心累、、、
如果,各位同学有定制开发ie6-8版本的需求,还是尽量不要用单页应用模式了,也不要用avalon这类mvvm框架了,也不是不能做,这种mvvm模式写起来还是挺爽的。
只是一旦在 ie6上遇到奇葩问题,你会很闹心,这个风险在工期约束比较紧的情况下,尤其需要注意。
基础框架
本项目为单页应用,框架搭建为:avalon(双向数据绑定)+requireJS(js及模板动态加载)+director(路由管理)
avalon
- 只用到了数据绑定和指令,其他如组件等未使用
requireJS
- 业务代码(js&&html)模块化加载
- html模板动态加载使用require的插件text.js实现
注:css在scss中引入命名空间,实现的模块管理(原则上也可以做require动态加载,但是没大必要了)
director.js
- 非常优秀的路由管理库。git地址:https://github.com/flatiron/director.js (调研过竞品page.js,其开发文档以及ie6-8支持度远不如其文档描述的那样友好,果断放弃)
- 一些源码改动。因为业务中需要设置document.domain,这会导致ie6-8中操作或者访问location对象或者iframe时遇到不同程度的“拒绝访问”限制,所以,手动修改了director.js的源码,改动部分见内网项目
js&&css 兼容性
最佳实践:
尽量避开使用ie6-8不支持的特性(如css属性选择器等等等等),因为多数polyfill并不像他们声称的那样靠谱(比如ieBetter、selectivizr)
一些可用的polyfill
少量代码段 一些特性几句代码即可支持,如html5标签支持、IE6背景图闪烁
es6-promise
jquery.placeholder(不是特完美)
ie6-8 avalon2 单页应用项目实战备忘的更多相关文章
- vue-route+webpack部署单页路由项目,访问刷新出现404问题
问题描述:前端同事使用Vue.js框架,利用vue-route结合webpack编写了一个单页路由项目,运维协助在服务器端配置nginx.部署完成后,访问首页没问题,从首页里打开二级页面没问题,但是所 ...
- Vue.js结合vue-router和webpack编写单页路由项目
一.前提 1. 安装了node.js. 2. 安装了npm. 3. 检查是否安装成功: 打开cmd,输入node,没有报“node不是内部或外部命令”表示安装成功node.js. 打开cmd,输入np ...
- Vue Cli 3 搭建单页应用项目刷新 404 问题 解决方案(以Apache为例)
vue 项目 版本 Vue Cli 3.3 官方文档 https://router.vuejs.org/zh/guide/essentials/history-mode.html 因为本项目部署在 A ...
- Vue之vue自动化工具快速搭建单页项目目录
1 生成项目目录 使用vue自动化工具可以快速搭建单页应用项目目录. 该工具为现代化的前端开发工作流提供了开箱即用的构建配置.只需几分钟即可创建并启动一个带热重载.保存时静态检查以及可用于生产环境的构 ...
- 如何在vue单页应用中使用百度地图
作为一名开发人员,每次接到开发任务,我们首先应该先分析需求,然后再思考技术方案和解决方案.三思而后行,这是一个好的习惯. 需求:本项目是采用vue组件化开发的单页应用项目,现需要在项目中引入百度的地图 ...
- vue 单页应用中微信支付的坑
vue 单页应用中微信支付的坑 标签(空格分隔): 微信 支付 坑 vue 场景 在微信H5页面(使用 vue-router2 控制路由的 vue2 单页应用项目)中使用微信 jssdk 进行微信支付 ...
- 单页应用seo收录神器 -- seo-mask
前言 看到标题的人肯定会问,seo-mask是什么,为什么可以解决单页应用seo无法被收录的难题呢? 简单来讲seo-mask做的就是为已经发布线上运营的的单页应用项目建立另一个简单的利于seo的镜像 ...
- 手把手教你把web应用丢到服务器上(单页应用+ 服务端渲染)
前两篇文章中,我分别介绍了框架的搭建利用vue-cli + vant搭建一个移动端开发模板,并且把项目中axios请求和vuex的用法做了简要的介绍如何在项目里管理好axios请求与vuex.在这两篇 ...
- 从零搭建一个IdentityServer——单页应用身份验证
上一篇文章我们介绍了Asp.net core中身份验证的相关内容,并通过下图描述了身份验证及授权的流程: 注:改流程图进行过修改,第三方用户名密码登陆后并不是直接获得code/id_token/acc ...
随机推荐
- 【NOI2019模拟2019.7.4】朝夕相处 (动态规划+BM)
Description: 题解: 这种东西肯定是burnside引理: \(\sum置换后不动点数 \over |置换数|\) 一般来说,是枚举置换\(i\),则\(对所有x,满足a[x+i]=a[i ...
- NOI2019赛前两周被吊打记录
7.1 T1看了半天发现会个暴力FWT,然后突然返发现随便容斥一下就好了 T2猜了个只有13和23的,结果打个表发现伪了,然后标号不只一种连搜索都写错了,也没想过可以轮廓线dp,菜哭了o(╥﹏╥)o ...
- Android中的SrollView滚动详解
今天开发遇到一个需求就是ScrollView中嵌套一个ListView,同时需要实现滑动到底部自动加载更多,我们知道ListView滑动到底部简单实现onScrollListener()监听器即可,但 ...
- 01二重退背包+组合数学——cf1111d
退背包进阶,还是挺难想的 /* dp1[k]表示取到体积k的方案数 dp2[i][j][k]表示左侧必选ij的情况下,取到体积k的方案数 dp2[i][j][k]=dp1[k]-左侧不选ij的方案数 ...
- Python查看对象属性的方法
帮助https://docs.python.org/2/library/functions.html dir() 函数 D:\pythontest>python Python (v3. , :: ...
- [NOI.AC] candy
题意:求净利益. 思路: 其实我也不怎么懂题面. 不过这种题一般来说就是从最大的开始选. 所以考虑贪心. 那么代价如何处理呢?? 我们考虑两个序列同时选数,把代价每次记录到一个序列的和上,那么对于两次 ...
- 6.RabbitMQ Linux安装
RabbitMQ在Linux上安装,需要很多依赖库,如何不能解决依赖库德版本问题,可能会比较麻烦,最好结合Yum进行安装,我这里使用的Linux环境是64位CentOS6.2 ,使用Yum源是阿里云的 ...
- 城里城外看SSDT
引子 2006年,中国互联网上的斗争硝烟弥漫.这时的战场上,先前颇为流行的窗口挂钩.API挂钩.进程注入等技术已然成为昨日黄花,大有逐渐淡出之势:取而代之的,则是更狠毒.更为赤裸裸的词汇:驱动.隐藏进 ...
- 牛客练习赛43B Tachibana Kanade Loves Probability
题目链接:https://ac.nowcoder.com/acm/contest/548/C 题目大意 略 分析 利用快速幂先移到 k1 位,然后开始一个一个取余数. 代码如下 #include &l ...
- n-map安装实操
强烈建议大家从官网下载nmap,而不是其他的第三方.官网地址:https://nmap.org/download.html 打开是这样的,感觉有点阴森森的色调.BTW,谁能逃得过真香定律呢. wind ...