获得徽章 0
- 工程师日常
zz z z
＜⌒／ヽ-､_＿_
／＜_/＿＿＿＿／
￣￣￣￣￣￣￣
∧_∧ I FIGURED OUT
( ･ω･) HOW TO FIX THAT BUG
＿| ⊃／(＿＿_
／ └-(＿＿＿_／
via： cszhu展开17 - # 每天一道前端中高级面试题 # 前端工程化
请简述你对前端工程化的认识？
我的思考：前端工程化包含如下：
1.代码规范: 保证团队所有成员以同样的规范开发代码，比如使用eslint,或者使用同一个js格式化代码的插件，来格式化代码
2.分支管理: 不同的开发人员开发不同的功能或组件，按照统一的流程合并到主干。
3.模块管理: css\js\ui都进行模块化管理、方便复用
4.自动化测试：为了保证和并进主干的代码达到质量标准，必须有测试，而且测试应该是自动化的，可以回归的。
5.构建：主干更新以后，自动将代码编译为最终的目标格式，并且准备好各种静态资源，
6.部署。 将构建好的代码部署到生产环境。展开评论16 - 岗位: 前端
工龄: 3年前端
学历: 本科
坐标: 杭州
技术: React+Antd全家桶。vue 2.0+Element。jQuery，bootstrap...
项目: 在线简历有详细介绍
优势: 爱学习,爱分享,不介意学习新技术,上手快.
邮箱: liu@123456.plus展开4519 - 在移动端 click 有 300ms 延迟，是safari为了判断是否是双击事件而设计，浏览器要知道你是不是要双击操作以判断是否进行缩放
方案一: 禁用缩放
<meta name="viewport" content="user-scalable=no">
<meta name="viewport" content="initial-scale=1,maximum-scale=1">
缺点： 使得双指手势缩放也无效了
方案二: 更改浏览器视口宽度为设备宽度
如果设置了下述meta标签，那浏览器就可以认为该网站已经对移动端做过了适配和优化，就无需双击缩放操作了。
<meta name="viewport" content="width=device-width">
方案三：使用css属性touch-action
这个属性指定了相应元素上能够触发的用户代理（也就是浏览器）的默认行为。将属性值设为none，则不触发浏览器的默认行为。
缺点：支持程度低
方案四：模拟click事件
根据浏览器事件触发顺序：
touchstart --> touchmove --> touchend --> mouseover(有的浏览器没有实现) --> mousemove -->mousedown --> mouseup --> click
可以通过监测touchend事件，阻止原生click事件，模拟click事件并发出。展开533
